角ng-从控制器重复指令访问数据
角ng-从控制器重复指令访问数据
提问于 2017-03-09 19:54:30
我对以前的角度指令非常陌生，我用某种形式的ng来实现我要做的事情--包括并以肮脏的方式传递变量。
我对指令的范围和它们的能力非常困惑，我也意识到，一旦在ng内部使用了指令-重复这些变量的行为是不同的。
要理解我要找的是什么，你需要全貌。我把这些电子邮件存储在数据库里。每封电子邮件都有典型的属性，我编写了一个指令，使用ng-重复显示每个邮件。
app.directive('emailListing', function ($filter) {
return {
restrict: 'AE',
replace: 'true',
templateUrl: '../Pages/Views/Templates/emailListing.html',
scope: {
Date: "@",
Email: "@",
Content: "@",
Read: "@",
Subject: "@"
},
link: function (scope, elem, attrs) {
scope.Date = attrs.date;
scope.Email = attrs.email;
scope.Content = attrs.content;
scope.Subject = attrs.subject;
if (attrs.isnew == 'true') {
scope.Read = "logo-unread";
} else {
scope.Read = "logo-read";
}
scope.Date = $filter('date')(scope.Date, 'MM-dd-yyyy');
}
};
});HTML中的指令
<email-Listing ng-repeat="items in AllEmails | filter:{message: contentEmail} | limitTo:10" email="something@live.com"></email-Listing>HTML模板
<div class="news-row row">
<label>{{email}}</label>
</div>我现在面临一个问题，我想要使用角的UI bootstrap.modal指令。我希望能够在我的模板中点击一些东西，它将显示来自这个范围的数据的模式。
首先，我需要将传递给它的值(例如，email="something@live.com“)绑定到驻留在控制器中的某个对象。我不明白如何实现这一点，因为删除链接函数并将作用域更改为"=email“不会有任何效果。
有人能帮我写一个指令，接受日期、电子邮件、内容、isRead和主题这样的值。这些值由ng-重复提供，最后，该指令中的值必须绑定到控制器，以便按--例如在模式中--更改它们也会在指令中更新它们。
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-03-09 20:49:00
您的指令创建正确，您必须更改几行。由于您使用的是隔离作用域，因此没有必要将每个属性分配给作用域。
视图
<email-Listing ng-repeat="item in AllEmails | filter:{message: contentEmail} | limitTo:10" email="{{item.email}}" date="{{item.date}}" content="{{item.content}}" read="{{ item.is_new ? 'logo-unread' : 'logo-read' }}" subject="{{item.subject}}"></email-Listing>控制器
app.directive('emailListing', function ($filter) {
return {
restrict: 'AE',
replace: 'true',
templateUrl: '../Pages/Views/Templates/emailListing.html',
scope: {
Date: "@",
Email: "@",
Content: "@",
Read: "@",
Subject: "@"
},
link: function (scope, elem, attrs) {
/**
* These assignations are not necesary, you are using isolate scope
* which bind your properties to the directive's scope
*/
// scope.Date = attrs.date;
// scope.Email = attrs.email;
// scope.Content = attrs.content;
// scope.Subject = attrs.subject;
// if (attrs.isnew == 'true') {
// scope.Read = "logo-unread";
// } else {
// scope.Read = "logo-read";
// }
scope.Date = $filter('date')(scope.Date, 'MM-dd-yyyy');
},
controller: function ($scope, $uibModal) {
$scope.openModal = openModal;
// Here you can access to your email
// $scope.date, $scope.email, ...
function openModal() {
$uiModal.open({
....
})
}
}
};
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/42704286
复制相关文章
相似问题
腾讯云开发者
