Rak*_*rma 1 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>
Run Code Online (Sandbox Code Playgroud)
我的控制器文件是
(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);
};
});})();
Run Code Online (Sandbox Code Playgroud)
在这里我试图改变isSearch和isForm值的值,但没有运气.
更改:
ng-show="{{isForm}}"
Run Code Online (Sandbox Code Playgroud)
至
ng-show="isForm"
Run Code Online (Sandbox Code Playgroud)
你不必强制评估ng-show
https://docs.angularjs.org/api/ng/directive/ngShow
| 归档时间: |
|
| 查看次数: |
233 次 |
| 最近记录: |