4

我正在开发书中的示例应用程序AngularJS。

在下面的代码中，{{funding.needed}}不显示为10 * startingEstimate. 它按字面意思显示，即不呈现，就像{{funding.needed}}在页面上一样。

为什么？

<html ng-app>
<body ng-controller="TextController">

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js">
      </script>

    <form ng-controller="StartUpController">
        Starting: <input ng-change="computeNeeded()"
                         ng-model="funding.startingEstimate">
        Recommendation: {{funding.needed}}
    </form>

    <script>
        function StartUpController($scope) {
            $scope.funding = { startingEstimate: 0};

            $scope.computeNeeded = function() { 
                $scope.needed = $scope.startingEstimate * 10;
            };
        }
    </script>
</body>
</html>
4

1 回答 1

3

您需要删除 TextController，因为您尚未定义它，并且它会阻止加载其他内容，因为它会出错。此外，您还需要在某些尝试仅使用没有父引用的成员的地方规范您对 $scope.funding 对象的使用。以下是一个工作版本（在http://plnkr.co/edit/Jz95UlOakKLJIqHvkXlp?p=preview上查看它在 plunker 上的工作）

<html ng-app>
<body>

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js">
      </script>

    <form ng-controller="StartUpController">
        Starting: <input ng-change="computeNeeded()"
                         ng-model="funding.startingEstimate">
        Recommendation: {{funding.needed}}
    </form>

    <script>
        function StartUpController($scope) {
            $scope.funding = { startingEstimate: 0};

            $scope.computeNeeded = function() { 
                $scope.funding.needed = $scope.funding.startingEstimate * 10;
            };
        }
    </script>
</body>
</html>
于 2013-05-30T03:14:44.583 回答