角初學者NgModel結合

我有一個簡單input type=text與ng-model="xyz.zyx"，其中xyz是一個對象。在控制器中，我創建一個對象，併爲其賦值zyx屬性與分配如下：

xyz { 
    zyx: $scope.zzz 
}

不過，也有與ng-model="zzz"頁面上沒有輸入字段，然而，zyx被分配到價值我在開始描述的輸入字段中，輸入字段爲ng-model="xyz.zyx"。這是怎麼發生的？ $scope.zzz從哪裏來？

來源

2015-11-19 user2255226

'NG-model'設置一個2路數據綁定。因此，如果您在輸入字段中輸入內容，它將設置該變量，並且如果您設置該變量，它將設置該dom元素的值。 – rob

我意識到這一點，但輸入字段的ng-model的值是「xyz.zyx」，它在控制器中設置，而我在控制器內訪問的變量名是「zzz」。 ng-model =「zzz」頁面上沒有元素。「zzz」來自哪裏是我的問題。管制員如何知道這個價值是什麼，它從哪裏來？ – user2255226

當您的控制器加載它時，將zyx設置爲zzz，但是您的輸入綁定到xyz.zyx，它將通過雙向數據綁定來更改zyx的值。爲了進一步說明這一點，您可以將$ scope.zzz設置爲您的對象之外的「Test」，並且您的輸入將使用Test加載。然而，當你輸入你的輸入zyx會改變，但你的$ scope.zzz不會。 – Harbinger

我加入了註釋，以你的問題，但我也希望把一個plunker幫你鼓搗這是怎麼回事。

http://plnkr.co/edit/vYI1XiSm4cnEJjLRSO85

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

app.controller('MainCtrl', MainCtrl); 
MainCtrl.$inject = ['$scope']; 

function MainCtrl ($scope) { 
    $scope.zzz = "Test"; 

    $scope.xyz = { 
    zyx: $scope.zzz 
    } 
}

HTML

<html ng-app="app"> 

    <head> 
    <meta charset="utf-8" /> 
    <title>AngularJS Plunker</title> 
    <link rel="stylesheet" href="style.css" /> 
    <script data-require="[email protected]*" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.min.js"></script> 
    <script src="app.js"></script> 
    </head> 

    <body ng-controller="MainCtrl"> 
    <input type="text" ng-model="xyz.zyx"> 
    <pre>zzz: {{zzz | json}}</pre> 
    <pre>xyz: {{xyz | json}}</pre> 
    </body> 

</html>

來源

2015-11-19 16:32:39 Harbinger

角初學者NgModel結合

回答

相關問題