2015-01-19 15 views
6

tôi hy vọng ai đó có thể giúp tôi với một ví dụ nhỏ, bởi vì góc được lái xe cho tôi điên :(làm thế nào để có được dữ liệu trở lại từ chỉ thị góc

Tôi đang làm bởi lần đầu tiên một Công Thức rằng nên làm theo cấu trúc này: góc APP

mainController
----> smallController1
--------> otherElements
----> smallController2
--------> otherElements
- ->Trực tiếp ive1 (ví dụ 1)
----> anotherSmallController
---->Directive1 (ví dụ 2)

Các Directive1 nhận nhiều thuộc tính, và mỗi trường hợp sẽ cho phép việc lựa chọn nhiều lựa chọn, và kết quả của tương tác người dùng sẽ được lưu trữ trong một đối tượng và đối tượng đó sẽ được truy cập từ mainController cho từng cá thể riêng biệt.

Có ai có ví dụ làm việc như vậy không?

Cảm ơn trước, John

+0

Đó là một câu hỏi khá mơ hồ, bạn có thể cụ thể hơn? Bạn muốn truy cập dữ liệu trong Directive1 từ mainController? Có rất nhiều cách bạn có thể làm điều đó trong các tình huống khác nhau –

Trả lời

8

Cách tốt nhất để lấy lại dữ liệu từ chỉ thị là đính kèm mô hình vào phạm vi tự của chỉ thị.

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

 
app.controller('mainController', 
 
       [ 
 
    '$scope', 
 
    function($scope){ 
 
    $scope.myObj = "Initial Value"; 
 
    } 
 
]); 
 

 
app.directive('dirName', [ 
 
    function(){ 
 
    return { 
 
     restrict : 'A', 
 
     scope : { 
 
     obj : "=ngModel" 
 
     }, 
 
     link : function(scope, element, attrs){ 
 
     scope.obj = attrs.newValue; 
 
     } 
 
    }; 
 
    } 
 
]);
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script> 
 
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script> 
 
    <meta charset="utf-8"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body ng-app="app" ng-controller="mainController"> 
 
    <input dir-name ng-model="myObj" new-value="Final Value"> 
 
</body> 
 
</html>

Bạn có thể kiểm tra bin này là tốt: http://jsbin.com/fuqujo/1/edit?html,js,output

1

Sử dụng phát ra để gửi dữ liệu đến bộ điều khiển cha mẹ. Nó có thể là người nhận vì nghe sự kiện. Read về phát ra và phát sóng. Trong điều khiển con bạn hoặc sử dụng chỉ thị:

$ scope. $ Emit ('myEvent', object);

Điều này sẽ gửi đối tượng đến tất cả các bộ điều khiển chính. Trong sử dụng bộ điều khiển dành cho cha mẹ:

$ scope. $ On ('myEvent', function (event, obj) {console.log (obj);});

Để nghe đối tượng được phát ra.

0

Hãy thử mã này ra, nó có thể giúp bạn:

http://plnkr.co/edit/L1NwUnNePofyRAQ6GVIg?p=preview

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

app.controller('MainCtrl', function($scope) { 
    $scope.name = 'World'; 
    $scope.masterData = [ 
    { 
     entry: 'dunno' 
    }, 
    { 
     entry: 'stuff' 
    } 
    ] 
}) 
app.directive('vessel', function() { 
    return { 
    replace: true, 
    scope: { 
     data: '=', 
     speciality: '@' 
    }, 
    link: function(scope) { 
     scope.updateData = function() { 
     scope.data.entry = scope.speciality; 
     } 
    }, 
    template: '<div>{{data.entry}} <button ng-click="updateData()">update</button></div>' 
    } 
}); 

Và mẫu:

<body ng-controller="MainCtrl"> 
    <p>Master data {{masterData | json}}</p> 
    <div vessel data="masterData[0]" speciality="eggs"></div> 
    <div vessel data="masterData[1]" speciality="bacon"></div> 
    </body> 

Vì vậy, chúng tôi có các mô hình dữ liệu riêng biệt cho mỗi chỉ thị được cập nhật về đầu vào của người dùng, phù hợp với yêu cầu của bạn. Đúng?

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