在ng-click上填充Angular模态
Populate Angular Modal on ng-click
这是一个看似简单的任务,我有点挣扎。
我有一个来自ng-repeat的事件表。我希望用户能够点击事件的名称,并有它弹出一个模式与事件的详细信息。
我目前有一个链接到标题名称的ng-click="eventDetails(objectId)"
。然后在控制器中这是我的代码
app.controller('viewEventRequestsController', function($scope, EventFactory){
// this gets a list of events, one of the properties of the event is called objectId
EventFactory.query(function(response){
$scope.events = response.results;
});
//this is the function that runs when I click, the event name.
$scope.eventDetails = function(objectId){
$scope.modalOn = true;
$scope.modal = EventFactory.get({ objectId: objectId });
console.log($scope.modal)
}
});
这是我的标记的一部分
<tr ng-repeat="items in events | filter:filter | orderBy:sort:reverse">
<td>
<a ng-click="eventDetails(objectId)">{{items.Name}}</a>
</td>
我console.log ($ scope.modal);返回对象的完整数组,而不是我点击的单个对象。
然而,在我的应用程序的不同部分,当我使用$scope.events = EventFactory.get({ objectId: $routeParams.objectId });
这工作良好。我不能这样做的原因是因为我需要eventDetails弹出在一个模态而不是重定向到自己的页面。所以这次我无法使用$routeParams
。
关于如何实现这个,有什么想法吗?
可能是你的文章打错了,但是…以防你的实际代码是这样的,你在这里传递一个不存在的对象到你的eventDetails函数:
<a ng-click="eventDetails(objectId)">
你需要传递的是
<a ng-click="eventDetails(items.itemId /*or whatever the id field is */)">
,因为你正在迭代eventDetails数组并将每个元素的值赋给items变量:
ng-repeat="items in events | filter:filter | orderBy:sort:reverse"
就像我说的,不确定是否拼写错误,但事实上,你得到所有的事件,如果你没有通过任何过滤器,它的行为就像调用get()没有任何过滤器。
——UPDATE——
因为你在本地有你的事件,你可以得到一个单独的事件,而不必诉诸于另一个服务器请求。
在你的eventDetails()函数上试试:
$scope.eventDetails = function(event){
$scope.modalOn = true;
var index = $scope.events.indexOf(event);
if(index > -1){
$scope.modal = $scope.events[index];
}
}
在你的HTML只是传递完整的项目作为参数的函数:
<tr ng-repeat="items in events | filter:filter | orderBy:sort:reverse">
<td>
<a ng-click="eventDetails(items)">{{items.Name}}</a>
</td>
相关文章:
- 如何在angular ui模态控制器中定义函数
- 如何在 Angular 中将锚标记与模态链接,以便用户登录
- Angular Js 尝试从主按钮回调动态更改模态文本并且不起作用
- Angular js - 异步调用 $scope.users 后不更新模态值
- 使用 Angular 和 UI-bootstrap 对模态事件绑定无法工作的指令
- 从 Angular 模态服务中的模态主体模板返回数据
- 在模态(bootstrap ui angular)中编辑现有联系人
- 创建一个模态指令,并将click事件绑定到angular js中
- 当使用angular.js和ui.bootstrap时,从模态内部的按钮单击事件未触发
- ui引导Angular模态解析和Scope值
- 我的Angular ui模态找不到模板
- 显示控制器angular js的模态
- 将数据从 Angular 模态的控制器传递回主控制器
- Angular JS将msg广播到多个视图,包括模态窗口
- 无法从模态元素 Angular JS 获取$file
- 动态加载引导模态内容并使用 Angular.js 打开它
- Angular模态不会以弹出窗口的形式显示
- 如何从控制器打开和设置控制器Mobile-Angular模态
- 让多个Angular模态处理http响应数据
- 在ng-click上填充Angular模态