Question

我一直在努力解决与使用ui-router相关的ng-hide问题。简单的应用。 Index.html通过＆＃34; notes＆＃34;显示一些数据。路线，你点击＆＃34;细节＆＃34;然后你去了子路线＆＃34; notes.note＆＃34;查看其他记录下方的详细信息。＆＃34;细节＆＃34; html有一个＆＃34; Save＆＃34; ＆安培; ＆＃34;取消＆＃34;按钮。

现在有一个＆＃34; Add New＆＃34;如果您没有使用 ng-hide =＆＃34; HideAddNew＆＃34; 属性查看详细信息，请按此按钮。＆＃34; HideAddNew＆＃34;是控制器中的$ scope变量。当我点击＆＃34;详细信息＆＃34;在一行中，我在链接上有 ng-click =＆＃34; toggleAddNew（）＆＃34; ，而这又称为

    $scope.toggleAddNew= function()
    {
        $scope.HideAddNew=($scope.HideAddNew ? false : true);
    }

完美无缺，我的细节显示和我的＃34;添加新的＆＃34;按钮消失了。现在详细点击＆＃34;取消＆＃34;它会触发 ng-click =＆＃34; hideData（）＆＃34; 调用该函数：

   $scope.hideData=function()
   {
        $scope.toggleAddNew();
        $state.go('notes');
   }

现在我的＆＃34;添加新＆＃34;即使变量设置为false，即不要隐藏，它也已消失。我已经尝试了$ timeout＆＃34; hideData ＆＃34;功能和＆＃34; toggleAddNew ＆＃34;功能。我已尝试在 ＆＃34; $状态后添加 ＆＃34; $ scope.toggleAddNew（）;＆＃34; .go（＆＃39; notes＆＃39;）;＆＃34; 。我不想诉诸手动添加和删除课程。 AngularJS ver： v1.3.15 ，ui-router ver： v0.2.13 Thanx all：）

修改以下是Tony的工作吗？

 <button ng-if="HideAddNew" ng-click="SelectRoute('notenew')" class="btn btn-primary">
<span class="glyphicon glyphicon-plus -glyphicon-align-left"></span>Add New</button>

Answer 1

也许您可以简化并使用ng-switch代替。

这样的事情：

<ul ng-switch="expression">
  <li ng-switch-when="firstThing">my first thing</li>
  <li ng-switch-when="secondThing">my second thing</li>
  <li ng-switch-default>default</li>
</ul>

或者，您可以使用ng-if或ng-show代替ng-hide，例如：

<p ng-if="HideAddNew">it's here!</p>
<p ng-if="!HideAddNew">it's not here.</p>

修改

如果我理解您正在尝试实现完全，我会将ng-show与ng-click一起使用：

控制器：

$scope.addNew = false;

查看：

<button ng-show="!addNew" ng-click="addNew = true">Add New</button> <button ng-show="addNew" ng-click="save()">Save</button> <button ng-show="addNew" ng-click="addNew = false">Cancel</button>

Example

AngularJS与ui-router ng-hide在最初工作后无法正常工作

1 个答案: