Question

我正在学习角度，并尝试在我的测试页面上实现动态绑定。我的目标是实现输入框，每个输入框都绑定到一个动态获取的变量名称。

如果我不在根范围内声明结果数组 - 它将为每次重复创建结果数组，并且在每个框下面我将看到它自己的结果内容。

但是如果我在根范围内进行decalre结果，并且因为我没有重新声明它 - 不应该应用阴影，我应该将每个框绑定到根范围的数组中的变量。但相反，我只看到每个框下的根范围的数组内容，并且在更改输入时它不会改变。任何帮助表示赞赏。

以下是我的例子：

HTML：

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="index.js"></script>
<body ng-app="app" ng-controller="main" > <!--ng-init="results = [{'TEST': 1}]" -->

<div>
    <p>Name: <input type="text" ng-model="name"></p>
    <p ng-bind="name"></p>
    <input type="button" value="Clickme" ng-click="clickfnc()">
    <input type="button" value="Dump" ng-click="dump()">
    <input type="button" value="Pop" ng-click="remove()">
</div>

<div ng-repeat="x in params">
    <p>Name: <input type="text" ng-model="results[x.name]"></p>
    <p ng-bind="results[x.name]"></p>
    <p>{{x.name}}</p>
    <p>{{results}}</p>
    <p>{{params}}</p>
</div>

<hr>

<p ng-bind="results"></p>

<hr>

</body>
</html>

index.js：

var app = angular.module('app', []);
app.controller('main', function ($scope)
{
    $scope.clickfnc = function ()
    {
        console.log('click');

        $scope.params = [
            {
                name: 'ACCOUNT'
            },
            {
                name: 'AMOUNT'
            }
        ];
    };

    $scope.dump = function ()
    {
        console.log($scope.results)
    };

    $scope.remove = function ()
    {
        $scope.params.pop();
    }
});

Answer 1

如果我正确理解了你的目标是什么，那么你创建的results数组失败了，但你应该创建对象。
这里：<p>Name: <input type="text" ng-model="results[x.name]"></p>
您为结果分配新属性，因此它应该是对象。你可以查看这个小提琴 - https://jsfiddle.net/kb5udcac/

角度绑定到继承的范围变量

1 个答案: