Question

我正试图在我的角度js试验中做一个简单的功能。

我无法让方法调用工作，它只将它显示为文本。我无法弄清楚我在这么小的事情上做错了什么。

这是我的整个代码，下面是结果的屏幕截图。

html

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="app.js"></script>

<body ng-app="beerApp">
<div ng-controller="contentC">
    <div>
        <ul>
            <select ng-model="currentItem" ng-options="item.name for item in items"></select>
        </ul>
    </div>
    <div>
        <p>{{ currentItem.name }}</p>
        <p>{{ currentItem.country }}</p>
        <p>{{ average(currentItem.ratings) }}</p>
        <p ng-repeat="rating in currentItem.ratings">{{ rating.rating }}</p>
    </div>
</div>

js

var app = angular.module('beerApp', []);
app.controller('contentC', function($scope) {
$scope.items = [
    {name:'Rignes',country:'Norway', ratings:[
        {"rating":3}, {"rating":3}, {"rating":2}]},
    {name:'Pripps',country:'Sweden', ratings:[
        {"rating":2}, {"rating":3}, {"rating":5}]},
    {name:'Tuborg',country:'Denmark', ratings:[
        {"rating":5}, {"rating":4}, {"rating":3}]}
];
$scope.currentItem = {name:'Nothing'};
$scope.average = function (data) {
    console.log("called")
    var sum = 0;
    for(var i = 0; i < data.lenght; i++){
        sum += parseInt(data[i].rating);
    }
    var avg = sum/data.lenght;
    return avg;
};
});

curly brackets displayed

更正了js代码

$scope.average = function (data) {
        var sum = 0; 
        var ratings = 0;
        try {
            for (var d in data){
                sum += parseInt(data[d].rating);
                ratings++;
            }
        } catch (error) {
            sum = 0;
        }
        var avg = sum/ratings;
        return avg;
    };

Answer 1

average函数抛出一个错误，因此Angular会将绑定保留为原样，因为没有合理的值可以绑定它。

您的代码中存在一些错误：

length拼写错误
您没有通过平均
我认为您需要遍历data.ratings.length而不是data.length
您的默认currentItem没有评分属性。

工作演示http://codepen.io/anon/pen/reqbZG

var app = angular.module('beerApp', []);

app.controller('contentC', function($scope) {
    $scope.items = [
        {name:'Rignes',country:'Norway', ratings:[
            {"rating":3}, {"rating":3}, {"rating":2}]},
        {name:'Pripps',country:'Sweden', ratings:[
            {"rating":2}, {"rating":3}, {"rating":5}]},
        {name:'Tuborg',country:'Denmark', ratings:[
            {"rating":5}, {"rating":4}, {"rating":3}]}
    ];

    $scope.currentItem = {name:'Nothing', ratings: []};
    $scope.average = function (data) {
        var sum = 0;
        for(var i = 0; i < data.ratings.length; i++){
            sum += parseInt(data.ratings[i].rating);
        }
        var avg = sum/data.ratings.length;
        return avg;
    };
});

略微更新的HTML（平均方法调用）：

<!-- snip -->
    <p>{{ currentItem.name }}</p>
    <p>{{ currentItem.country }}</p>
    <p>{{average(currentItem)}}</p>
    <p ng-repeat="rating in currentItem.ratings">{{ rating.rating }</p>
<!-- snip -->

Answer 2

更改

libPods-YourApp.a

有关

    <p>{{average()}}</p>

另外，请尝试检查控制台（ctrl + shift + i）

角度js大括号显示为文本

2 个答案: