ng-srcは正常に動作していませんが、srcは正常に動作しています

サンプルWebページに画像を追加しようとしています。しかし、imgタグでng-srcを使用するたびに、イメージはページに表示されません（イメージは 'ng-src'の代わりに 'src'を使用すると表示されます）。ここに私のHTMLとJavaScriptファイルがあります。ng-srcは正常に動作していませんが、srcは正常に動作しています

Javascriptを& HTML：事前に

/** 
* Module 
* 
* Description 
*/ 
angular.module('myModule', []) 
    .controller('myCtrl', ['$scope', function($scope){ 
     $scope.clicked = ""; 
     $scope.clickMe = function() { 
      $scope.clicked= "Image Clicked";  
     }; 
    }]);

<html ng-app="mainModule"> 
<head> 
    <title>Testing For Image Click</title> 
    <script type="text/javascript" src="app.js"></script> 
    <script type="text/javascript" src="angular.js"></script> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"/> 

    <!-- Latest compiled and minified JavaScript --> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 
</head> 
<body class="container" ng-controller="myCtrl"> 
    <div> 
     <img ng-src="bluegem.jpg" ng-click="clickMe()"/> 
    </div> 
</body>

感謝。

出典

2016-05-06 Pranjal

なぜ「ng-src」を使用したいのですか？あなたはハードコーディングされたイメージパスを使用しているので、 'src'は細かいです。 – mindparse

このコードで2-3問題
1. MyModuleというのがあると（angular.jsがここapp.js 前に言及しなければならない上記のファイルのmainModule（あなたapp.js MyModuleという名前のモジュールを作成していますが、あなたのhtmlにあなたがmainModuleを使用している）
2.順序私はコード

を追加してい

<html ng-app="myModule"> 
<head> 
    <title>Testing For Image Click</title> 

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 
    <script type="text/javascript" src="app.js"></script> 
    <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"/> 

    Latest compiled and minified JavaScript 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> --> 


</head> 
<body class="container" ng-controller="myCtrl"> 
    <div> 
     <img ng-src="{{image}}" ng-click="clickMe()"/> 
    </div> 
</body>

および

angular.module('myModule', []) 
    .controller('myCtrl', ['$scope', function($scope){ 
     $scope.clicked=""; 
     $scope.image = "bluegem.jpg" 
     $scope.clickMe=function() 
     { 

      $scope.clicked="Image Clicked"; 
     }; 
    }]);

出典

2016-05-06 12:25:42 Rakeschand

これは今働いています。あなたの助けに感謝します。 – Pranjal

変更マークアップあなたが前にセットアップを持っていたとしてURL NG-srcは、変数に結合するようにしていない：

<img ng-src="{{imageURL}}" ng-click="clickMe()"/>

出典

2016-05-06 12:23:07

ng-srcは正常に動作していませんが、srcは正常に動作しています

答えて

関連する問題