角度表達不顯示值

我在HTML文件中角度表達不顯示值

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head > 
    <title></title> 
    <script src="Scripts/angular.min.js"></script> 
    <link href="Styles.css" rel="stylesheet" 
</head> 
<body ng-app="FirstModule"> 
    <div ng-controller="myController"> 
     <table> 
      <thead> 
       <tr> 
        <th>Name</th> 
        <th>Likes</th> 
        <th>DisLikes</th> 
        <th>Likes/Dislikes</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="technology in technologies"> 
        <td>{{ technology.name}}</td> 
        <td>{{ technology.likes}}</td> 
        <td>{{ technology.dislikes}}</td> 
        <td> 
         <input type="button" value="Like" ng-click="incrementLikes(technology)" /> 
         <input type="button" value="Like" ng-click="incrementDisLikes(technology)" /> 
        </td> 
       </tr> 
      </tbody> 
     </table> 
    </div> 
</body> 
</html>

下面的代碼和JS代碼

/// <reference path="angular.min.js" /> 
var myApp = angular.module("FirstModule", []); 
var myController = function ($scope) { 



    var technologies = [ 
         { name: "C#", likes: 0, dislikes: 0 }, 
         { name: "ASP.NET", likes: 0, dislikes: 0 }, 
         { name: "SQL", likes: 0, dislikes: 0 }, 
         { name: "AngularJS", likes: 0, dislikes: 0 }, 
    ]; 

    $scope.technologies = technologies; 
    $scope.incrementLikes = function (technology) { 
     $scope.incrementLikes++; 
    } 

    $scope.incrementDisLikes = function (technology) { 
     $scope.incrementDisLikes++; 
    } 
}; 

myApp.controller("myController", myController);

我收到以下錯誤的錯誤：$注射器：modulerr 模塊錯誤。我是angularjs的新手，並試圖學習事件處理。點擊按鈕時，點數會增加，不喜歡。

來源

2016-03-22 curiousDev

你'ngApp'聲明爲'MyModule' - 但在代碼中你有'FirstModule' - 你也有'MyController' vs'myController' – tymeJV

Everyting似乎在這裏工作https://plnkr.co/edit/32ETCvd8KGsG9zUdfdZk?p=preview –

@PankajParkar有一個也是試圖增加範圍函數而不是傳入的工藝對象的屬性的錯誤。 – Lex

這是因爲您在HTML有這樣的：

<body ng-app="MyModule">

然而你定義了你的應用程序模塊：

var myApp = angular.module("FirstModule", []);

你需要改變他們，使他們或者都「MyModule的」或「FirstModule」。

更新
所以，你必須糾正的模塊注入錯誤，但也有這樣的錯誤：

$scope.incrementLikes = function (technology) { 
    $scope.incrementLikes++; 
} 

$scope.incrementDisLikes = function (technology) { 
    $scope.incrementDisLikes++; 
}

它應該是：

$scope.incrementLikes = function (technology) { 
    technology.likes += 1; 
} 

$scope.incrementDisLikes = function (technology) { 
    technology.dislikes += 1; 
}

您可能還需要改變你的第二個按鈕的值是「不喜歡」而不是「喜歡」。

Working JSFiddle

相關的代碼，HTML第一：

<div ng-app="FirstModule" ng-controller="myController"> 
    <table> 
     <thead> 
      <tr> 
       <th>Name</th> 
       <th>Likes</th> 
       <th>DisLikes</th> 
       <th>Likes/Dislikes</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr ng-repeat="technology in technologies"> 
       <td>{{ technology.name}}</td> 
       <td>{{ technology.likes}}</td> 
       <td>{{ technology.dislikes}}</td> 
       <td> 
        <input type="button" value="Like" ng-click="incrementLikes(technology)" /> 
        <input type="button" value="Dislike" ng-click="incrementDisLikes(technology)" /> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
</div>

的Javascript：

var myApp = angular.module("FirstModule", []); 
var myController = function($scope) { 
    var technologies = [{ 
     name: "C#", 
     likes: 0, 
     dislikes: 0 
    }, { 
     name: "ASP.NET", 
     likes: 0, 
     dislikes: 0 
    }, { 
     name: "SQL", 
     likes: 0, 
     dislikes: 0 
    }, { 
     name: "AngularJS", 
     likes: 0, 
     dislikes: 0 
    }, ]; 

    $scope.technologies = technologies; 

    $scope.incrementLikes = function(technology) { 
     technology.likes += 1; 
    } 

    $scope.incrementDisLikes = function(technology) { 
     technology.dislikes += 1; 
    } 
}; 

myApp.controller("myController", myController);

來源

2016-03-22 21:12:07 Lex

沒有它的複製粘貼錯誤 – curiousDev

@curiousDev我更新了問題以解決模塊注入錯誤後解決錯誤。 – Lex

仍然不能正常工作 – curiousDev

角度表達不顯示值

回答

相關問題