chuyển đối tượng đến angularjs chỉ thị từ bộ điều khiển

Cố gắng lấy đầu của tôi xung quanh AngularJS chỉ thị. Tôi cần truyền một đối tượng đầy đủ từ bộ điều khiển chính của tôi đến chỉ thị. Xem mã dưới đây và jsfiddle: http://jsfiddle.net/graphicsxp/Z5MBf/4/chuyển đối tượng đến angularjs chỉ thị từ bộ điều khiển

<body ng-app="myApp"> 
<div ng-controller="MandatCtrl"> 
    <div person myPerson="mandat.person"></div> 

    <span>{{mandat.rum}}</span> 
    <span>{{mandat.person.firstname}}</span> 

</div>

và kịch bản:

var myApp = angular.module("myApp", []); 

myApp.controller("MandatCtrl", function ($scope) { 
$scope.mandat = { rum: "15000", person: { id: 1408, firstname: "sam" } }; 
}); 

myApp.directive("person", function() {  
return { 
    scope: { 
     myPerson: "=" 
    }, 
    template: 'test: <div ng-model="myPerson"><input type="text" ng-model="firstname" /></div>' 
} 
});

Ok, các ràng buộc đang làm việc tốt cho mandat.rum và mandat.person.firstname.

Tuy nhiên, tôi đang cố gắng chuyển mandat.person tới chỉ thị và nó không hoạt động. Tôi biết tôi phải làm điều gì sai, câu hỏi là gì? :)

Nguồn

2013-04-13 Sam

Một lưu ý chung: Xin đừng trộn Thụy Điển và tiếng Anh trong mã của bạn. Cú pháp là bằng tiếng Anh, giữ mã của bạn bằng tiếng Anh mà không cần trộn. Nó chỉ làm cho nó khó hiểu hơn, mặc dù tiếng Thụy Điển là ngôn ngữ mẹ đẻ của tôi. –

Tôi ước tôi đã nói tiếng Thụy Điển: p Bạn thấy bất kỳ tiếng Thụy Điển nào trong mã của tôi ??? – Sam

Xin vui lòng xem dưới đây bản sao làm việc

<!doctype html> 
<html ng-app="plunker" > 
<head> 
    <meta charset="utf-8"> 
    <title>AngularJS Plunker</title> 

    <link rel="stylesheet" href="style.css"> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script> 
    <script src="app.js"></script> 
</head> 
<body ng-controller="MainCtrl"> 
     <span>{{mandat.rum}}</span> 
     <span>{{mandat.person.firstname}}</span> 
    <input type="text" ng-model="mandat.person.firstname" /> 
    <my-directive mandateperson="mandat.person" > 

     </my-directive> 
    <script type="text/javascript"> 
     var app = angular.module('plunker', []); 

     app.controller('MainCtrl', function ($scope) { 
      $scope.mandat = { name: "John", surname: "Doe", person: { id: 1408, firstname: "sam" } }; 
     }); 


     app.directive('myDirective', function() { 
      return { 
       restrict: 'E', 
       template: "<div><span>{{mandateperson.id}}<span><input type='text' ng-model='mandateperson.firstname' /></div>", 
       replace: true, 
       scope: { mandateperson: '=' } 
       } 
      } 
     ) 
    </script> 
</body> 
</html>

Nguồn

2013-04-13 16:55:55

tuyệt vời, hoạt động. Nhưng tôi không thể thấy có gì sai với mã của tôi. Bạn có thể chỉ cho tôi những gì tôi đã làm sai? Bạn không làm chính xác giống như bạn đang sử dụng giới hạn: 'E' nhưng đó không thể là lý do mã của bạn đang hoạt động, hoặc có thể không? – Sam

Tôi nghĩ rằng đó là bởi vì bạn phải đóng gói tài sản của bạn trong một đối tượng. Vì vậy, thay vì làm: bạn phải làm – jpmorin

nó dường như không rằng, tôi đã thử cả hai cách và không ai trong số họ làm việc cho tôi. – Sam

chuyển đối tượng đến angularjs chỉ thị từ bộ điều khiển

Trả lời

Các vấn đề liên quan