AngularJS - 从属性内的范围获取打印值? [英] AngularJS - Get printed value from scope inside an attribute?
问题描述
我目前正在处理一个 AngularJS 项目，但遇到了这个特定要求.
我们有一个包含所有数据的服务，我们称之为DataFactoryService".然后，我有一个名为 "DataFactoryController" 的控制器，它正在制作魔法，然后在视图中绘制它.
很平常..
{{列表名称}}...所以，它看起来是一个相当不错的应用程序.现在，我们需要将多个数据传递到一个元素中.好的，我认为ng-repeat"可以，但不，我们需要将它放在元素属性中.
场景是:
- 在其中一个页面上，我们有多个包含多个数据的列表.
- 每个数据都有一个唯一的代码或 ID，当我们执行或单击按钮时应该传递这些代码或 ID.
- 在某些情况下，我们传递了多个数据.
类似这样的事情(如果我们在一个或多个列表中有 3 个项目，那么我们将传递列表的 3 个项目代码):
提交</a><a href = "#" class = "btn btn-default" data-factory = "code1;code2;code3;">取消</a>在上面的示例中，'code1,code2,code3' 来自列表数据.我尝试了几种方法，例如ng-repeat"、angular.each"、array、ng-model"，但没有成功.
从我所尝试的一切中，我知道 "ng-model" 是解决我的问题的最可能方法，但我不知道从哪里开始.但是下面的代码不起作用，你能告诉我方法吗?:)
{{list.code}}{{dataFactorySet.code}}数据来自服务，然后在控制器中被调用，并在 HTML 页面上绘制.
//控制器$scope.list = dataFactoryService.getAllServices();初始化时正在加载列表上的数据，并希望将数据标签与列表数据一起初始化.
唯一代码是 $scope.list 的一部分.
//JSON 结构示例[{//列表级别name: '我的文档',调试:假，内容:[//列出内容级别{代码:'AHDV3128'，text: '文件目录',...},{代码:'AHDV3155'，text: '图片目录',...},],....},{//列表级别name: '我的功能',调试:假，内容:[//列出内容级别{代码:'AHGE5161'，text: '文件目录',...},{代码:'AHGE1727'，text: '图片目录',...},],....}]
你能帮我一下吗?非常感谢提前！
PLUNKER -> http://plnkr.co/edit/Hb6bNi7hHbcFa9RtoaMU?p=preview
这个特定问题的解决方案可能是编写 2 个函数，它们将返回与循环中列表相关的 baseId 和代码.
我建议像下面那样做
提交<a href = "#" data-factory = "{{getDataFactory(list)}}" database = "{{getDataBase(list)}}">取消</a>//在你的控制器中编写方法 -
$scope.getDataFactory = function(list){var factory = list.map( (a) => a.code );factory = factory.join(";");返厂；}$scope.getDataBase= 函数(列表){var base= list.map( (a) => a.baseId);base = base.join(";");返回基地；}如果您在执行此操作时发现任何问题，请告诉我.这绝对可以解决您的问题.
I'm currently working on an AngularJS project and I got stuck in this specific requirement.
We have a service that has all the data, let's call it "DataFactoryService". Then, I have a controller called "DataFactoryController" that is making the magic and then plot it in the view.
Pretty usual..
<div ng-repeat = "list in collection">
{{list.name}}
...
</div>
So, it looks like a pretty decent app. Now, we have a requirement that pass multiple data into one element. Okay, I thought an "ng-repeat" would do, but no, we need to have it inside an element attribute.
The scenarios are:
- At one of the pages, we have multiple lists with multiple data.
- Each data has a unique code or ID that should be passed when we do an execution or button click.
- There are instances that we're passing multiple data.
Something like this (if we have 3 items in a list or lists, so we're passing the 3 item codes of the list):
<a href = "#" class = "btn btn-primary" data-factory = "code1;code2;code3;">
Submit
</a>
<a href = "#" class = "btn btn-default" data-factory = "code1;code2;code3;">
Cancel
</a>
In the example above, 'code1,code2,code3' came from the list data. I tried several approach like "ng-repeat", "angular.each", array, "ng-model" but I got no success.
From all I've tried, I knew that "ng-model" is the most possible way to resolve my problem but I didn't know where to start. the code below didn't work though, can you show me the way please? :)
<span ng-model = "dataFactorySet.code">{{list.code}}</span>
{{dataFactorySet.code}}
The data is coming from the service, then being called in the controller, and being plot on the HTML page.
// Controller $scope.list = dataFactoryService.getAllServices();The data on the list are being loaded upon initialization and hoping to have the data tags initialized as well together with the list data.
The unique code(s) is/are part of the $scope.list.
// Sample JSON structure [ { // list level name: 'My Docs', debug: false, contents: [ // list contents level { code: 'AHDV3128', text: 'Directory of documents', ... }, { code: 'AHDV3155', text: 'Directory of pictures', ... }, ], .... }, { // list level name: 'My Features', debug: false, contents: [ // list contents level { code: 'AHGE5161', text: 'Directory of documents', ... }, { code: 'AHGE1727', text: 'Directory of pictures', ... }, ], .... } ]
Can you help me out, please? BIG THANKS in advanced!
PLUNKER -> http://plnkr.co/edit/Hb6bNi7hHbcFa9RtoaMU?p=preview
The solution for this particular problem could be writing 2 functions which will return the baseId and code with respect to the list in loop.
I would suggest to do it like below
<a href = "#" data-factory = "{{getDataFactory(list)}}" data-base = "{{getDataBase(list)}}">Submit</a>
<a href = "#" data-factory = "{{getDataFactory(list)}}" data-base = "{{getDataBase(list)}}">Cancel</a>
//inside your controller write the methods -
$scope.getDataFactory = function(list){
var factory = list.map( (a) => a.code );
factory = factory.join(";");
return factory;
}
$scope.getDataBase= function(list){
var base= list.map( (a) => a.baseId);
base= base.join(";");
return base;
}
Let me know if you see any issue in doing this. This will definitely solve your problem.
这篇关于AngularJS - 从属性内的范围获取打印值?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
