4

我有以下

<table id="socialMediaContainer" class="socialMediaContainer" style="width: 100%;">
    <tbody>
        <tr ng-repeat="row in detailCollection.ChannelsInfo" 
            ng-controller="WhiteLabelSitesCtrl">
            <td><input id="txtSocialName" type="text" class="socialName"
                placeholder="Name" ng-disabled="ViewMode" maxlength="250"
                value="{{row.SocialChannelName}}" /> </td>
            <td><input id="txtSocialURL" type="text" class="txtLabel socialURL"
                placeholder="URL" ng-disabled="ViewMode" maxlength="250"
                value="{{row.SocialChannelURL}}" />
            </td>
            <td class="DragnDropIcon"></td>
            <td>
                <a class="orange " ng-show="ViewMode">Upload</a></td>
        </tr>                    
    </tbody>
</table>

并且我在 ng-repeat 之外有另一个按钮来更新 ViewMode 变量，但这在 ng-repeat 内不起作用，对于 ng-show 和 ng-disabled 也不起作用。我在这里想念什么？

4

4 回答 4

3

问题似乎是，您需要将ngController指令移动到该级别（至少）：如果稍后迭代控制器中定义的数组，table它不能位于同一元素上。ngRepeat

<table ng-controller="WhiteLabelSitesCtrl" ... >
    <!-- ... -->
</table>

演示： http ://plnkr.co/edit/tu4TLmWIxdcYaiEd7whn?p=preview

于 2015-05-11T20:56:08.513 回答
1

ng-repeat为转发器中的每个项目创建一个子范围。

因此viewmode将是该子范围上的原始值，因此作为原始值将失去与父范围的继承绑定。

如果您将其声明为控制器范围内的对象属性，那么它将是对该父对象的引用。

$scope.mode ={ViewMode: false}

示例

<a class="orange " ng-show="mode.ViewMode">Upload</a></td>
于 2015-05-11T20:55:39.643 回答
0

ng-repeat 之外的按钮不会嵌套在同一个控制器中。它正在修改的变量可能与 WhiteLabelSitesCtrl 下的 ViewMode 正在查看的变量不同。

当您指向这个 ng-controller 时，该控制器将被激活并使用与之关联的新范围

<div ng-repeat ng-controller="WhiteLabelSitesCtrl">
   <div ng-show="someValue"></div>
</div>

当您在另一个标签上再次引用此控制器时，它不会像您期望的那样引用现有控制器，它实际上会做完全相同的事情......它将创建控制器，并为它创建一个新范围-与原版完全分离。

<div ng-controller="WhiteLabelSitesCtrl">
     <button ng-click="someValue = !someValue"></button>
</div>
于 2015-05-11T20:49:39.930 回答
0

尝试在ng-repeat范围内传递对象而不是变量。相反ViewMode，在您的控制器中声明：

$scope.model = {};

$scope.model.ViewMode = false;`.

你的绑定必须是这样的：<a class="orange " ng-show="model.ViewMode">. 之后一切正常。

阅读这篇文章以了解它发生的原因：https ://github.com/angular/angular.js/wiki/Understanding-Scopes

于 2015-05-11T20:52:39.760 回答