通过控制器显示ng-show无效

时间:2016-08-28 23:58:54

标签: html css angularjs ionic-framework

我有一个包含3个元素的页面。第一个搜索栏,第二个搜索结果区和第三个表单。所以这里的用例就像是,默认搜索栏和表格div将显示并隐藏搜索结果div。如果我在搜索栏上输入密钥,那么我将获取客户端数据,因此要隐藏表单栏并显示搜索栏结果。在搜索var结果中,如果我单击任一项(客户端),则隐藏搜索结果并显示表单div。然后我想在表单字段中填写点击的客户端名称,我是angularjs中的新用户请帮帮我。

<ion-view title="Client Details" id="page5" ng-init="isSearch=false;isForm=true;" style="background-color:#F1F8E9;">
<ion-content padding="true" class="has-header">
  <label class="item item-input">
      <i class="icon ion-search placeholder-icon"></i>
      <input type="search" ng-model="str" ng-change="searchByName(str)" placeholder="Search Client">
  </label>
  <ion-list ng-show="{{isSearch}}" id="home-list2">
        <ion-item ng-repeat="client in clientList" id="home-list-item2" ng-click="str=true">{{client.name}}</ion-item>
    </ion-list>
    <form ng-show="{{isForm}}" id="clientDetails-form1" class="list ">
        <label class="item item-input item-floating-label" id="clientDetails-input1">
            <span class="input-label">Name</span>
            <input type="text" placeholder="Name">
        </label>
    </form>
</ion-content>

我的控制器文件是

(function() {
var app = angular.module('clientdetailsctrl', ['clientdetailsservice']);
app.run(function($rootScope, $state, ClientDetails) {

});

app.controller('ClientDetailsCtrl', function($scope, $rootScope, $state, ClientDetails) {
    $scope.searchByName = function(str) {
        $scope.isSearch = true;
        $scope.isForm = false;
        $scope.clientList = [];
        ClientDetails.searchByName($scope, str);
    };
});})();

这里我试图改变isSearch和isForm值的值,但没有运气。

1 个答案:

答案 0 :(得分:6)

变化:

ng-show="{{isForm}}"

ng-show="isForm"

您不必强制评估ng-show

https://docs.angularjs.org/api/ng/directive/ngShow