Question

对Angular JS不是很熟悉，但这就是我拥有的和我想要的东西：

<div ng-app="MyApp" ng-controller="appController"> 
   <div class="input-group">
     <input class="form-control enableEnter" type="text" ng-model="action"/>
      <div class="input-group-btn">
        <button class="btn btn-primary" ng-click="search()">Search</button>
      </div>
   </div>   
   <ul class="dropdown-menu" id="list" ng-show = {{display}} >
        <li> hello </li>
        <li class="dropdown" ng-repeat="x in actions">
            {{x.name}}
        </li>
    </ul>
</div>

我的js文件：

MyApp.controller('appController', ['$scope', function ($scope) {
    $scope.actions = [];
    $scope.display=false;
    $scope.search = function () {
        $.get("http://localhost:8080/get/something/" + $scope.action)
            .success(function (response) {
                console.log(response);
                $scope.actions = response['RESPONSE'];
                $scope.display=true;
            }).error(function (jqXHR, textStatus, errorThrown) {
                console.error("Error retrieving something list", textStatus, errorThrown);
            });
    }
}]);

$scope.actions在控制器中初始化为空，但点击＆＃34;提交＆＃34;按钮，我们获得了actions中填充的操作列表。我想在表单下方显示此列表。为此，我在单击提交时更改ng-show的值。这会自动更新<UL>元素吗？因为即使点击后我似乎也看不到任何东西。

Answer 1

您无需在{{ }}内插入ng-show：

<ul class="dropdown-menu" id="list" ng-show="display" >
    <li> hello </li>
    <li class="dropdown" ng-repeat="x in actions">
        {{x.name}}
    </li>
</ul>

您可能还想查看ng-if。

Answer 2

问题出在以下声明中

<ul class="dropdown-menu" id="list" ng-show = {{display}} >

`change ng-show= {{display}} to ng-show='display'`

检查这个工作示例 - 在这个例子中，我点击后创建了提交按钮，我有更改显示值并存储了一些虚拟数据。

https://jsfiddle.net/Shital_D/fc0L5pe3/2/

使DOM元素可见并刷新：Angular JS

2 个答案: