Ich habe hier zwei Versionen, um dasselbe in AngularJS zu erreichen (wo ich neu bin und gerade lerne).Welche Art der Bindung an dynamische Optionsfelder ist besser?
Der Code ist unten. Für diejenigen, die Code-Stift bevorzugen: old und new.
Welche davon ist besser und warum?
Auch während die alte Version auf einer Funktion und ng-Klick beruht, vermeidet die neue Version das. Ich konnte jedoch nicht tun, was die neue Version tut, ohne das "$ scope.my" -Objekt einzubeziehen, d. H. Wenn ich es "$ scope.preference" mache, scheint die Modellierung nicht zu funktionieren. Gibt es eine Möglichkeit, dass ich das tun könnte?
Sicher, es ist etwas offensichtlich, dass ich vermisse, aber ich konnte was nicht finden.
var myApp = angular.module('myApp', []);
myApp.controller('ExampleController', ['$scope',
function($scope) {
$scope.colors = ["blue", "red", "green"];
//old way
$scope.color = "";
$scope.updateColor = function(input) {
$scope.color = input;
}
//new way
$scope.my = {preference: ''};
}
]);
<head>
<title></title>
<script src="https://code.angularjs.org/1.5.8/angular.js"></script>
</head>
<body ng-app="myApp" ng-controller="ExampleController">
<!--https://docs.angularjs.org/api/ng/directive/ngValue -->
<div ng-repeat="col in colors">
<input type="radio" ng-model="color" value="col" name="favcol" ng-click="updateColor(col)">{{col}}
<br>
</div>
<p>And the result is: {{color}}</p>
<hr />
\t \t <label ng-repeat="col in colors" for={{col}}>
\t \t \t <input type="radio" ng-model="my.preference" ng-value="col" id="{{col}}"
\t \t \t name="favcol">
\t \t {{col}}<br>
\t </label>
<p> And the result is: {{my.preference}}</p> </body>
Die empfohlene Best Practice besteht darin, immer einen "Punkt" in Ihre 'ng-Modelle' zu setzen. Weitere Informationen finden Sie unter [DIESES VIDEO] (http://www.youtube.com/watch?v=ZhfUv0spHCY&feature=youtu.be&t=30m) von einem AngularJS-Entwicklungsteam. Siehe auch [Angular Wiki: Die Nuancen der Scope-Prototyp-Vererbung] (https://github.com/angular/angular.js/wiki/Understanding-Scopes). – georgeawg