AngularJS

Question

我正在为我们的应用程序处理用户配置文件 "card" 类型的内容。这个想法是利用 AngularJS Material 库为非管理员用户创建一个简单的界面来管理分配给他们的其他用户。

我有一个 ng-repeat 运行提取这些卡片的数据，然后为它们生成标记，如下所示：

<!-- language: lang-js -->
<div class="col-md-6 md-padding float-left" ng-repeat="user in allUsers">
    <md-toolbar class="row col-md-12 md-hue-5 md-dense px-0">
        <div class="md-toolbar-tools">
            <span class="col-md-10">{{ user.name }}</span>
            <md-button id="managedUserDetails" type="submit" ng-click="null" class="md-fab" aria-label="Click to view profile">
                <md-icon md-svg-src="/images/svg/action/ic_open_in_new_48px.svg"></md-icon> 
            </md-button>
        </div>
    </md-toolbar>

    <div class="row col-md-12 border border-dark">
        <div class="row col-md-12">
            <md-input-container class="md-block col-md-6" flex-gt-xs>
                    <label>Name:</label>
                    <input ng-model="user.name" class="detailDisabled" disabled>
            </md-input-container>

//code continues for other bits, and yes, the tags are closed :)

我的问题是关于 md-button 元素的。在其中，我想使用一个函数来显示该用户的扩展视图，但为此我需要按钮所在的特定用户卡中的数据。然后我可以使用该数据来填充扩展视图.

所以，问题：

有没有办法告诉Angular"Give me the data that you used to generate the parent element?"

如果没有，我将不得不做一些思考，因为我现在能想到的只有......非优雅的解决方案:)

Answer 1

您可以使用 ng-init = "someFunction(user)"

<div class="col-md-6 md-padding float-left" ng-repeat="user in allUsers"
     ng-init = "someFunction(user)">

Answer 2

您可以将用户对象直接传递给ng-click，使用ng-init将在元素生成时一直调用该方法，

<md-button id="managedUserDetails" ng-click="getAdvancedView(user)" class="md-fab" aria-label="Click to view profile">
   <md-icon md-svg-src="/images/svg/action/ic_open_in_new_48px.svg"></md-icon> 
</md-button>

并且在您的控制器上，您可以在按钮单击事件中访问整个用户对象，

$scope.getAdvancedView = function(user) {
   console.log(user.name);
}

AngularJS - 从 ng-repeat 获取当前对象

AngularJS - Get current object from ng-repeat

javascript

angularjs-ng-repeat

angular-ngmodel

angularjs-material