AngularJs+TypeScript:如何在Angular控制器中实现if else条件
AngularJs+TypeScript: How to implement if else condition in Angular Controller
我正在尝试在 angular 中实现一个 if else 条件 controller.I 已经采取了下拉菜单并且在其索引更改时我正在绑定我的另一个下拉菜单 down.I 已经尝试过 ng-if也是,但它会隐藏整个下拉菜单,我希望下拉菜单可见。这是我的 html 代码:-
<div data-ng-app="CustomerNew" data-ng-controller="CreateCustomerCtrl as custom" ng-init="getFormData();">
<table style="width: 144% ! important;" class="TableStyle1" id="Table1" cellspacing="0" cellpadding="2" border="0">
<tr>
<td>Billing Type:</td>
<td>
<select id="listBillingType" ng-change="listBillingTypeselectedindexchange(custom.listBillingType)" data-ng-options="blngtype as blngtypee for (blngtype,blngtypee) in listBillingType" data-ng-model="custom.listBillingType" style="width: 182px !important; height: 34px;">
<option value="">Choose an option {{optional ? '(optional)' : ''}}</option>
</select>
</td>
</tr>
我试图根据上述下拉索引填充另一个下拉列表。
<tr>
<td nowrap style="height: 26px">Parent Account:</td>
<td style="height: 26px">
<select id="listParentAccount" data-ng-options="prntact as prntact.AccountNumber +' - '+ prntact.FullName for prntact in listParentAccount" ng-model="custom.listParentAccount" style="width: 182px !important; height: 34px;">
<option value="">Choose an option {{optional ? '(optional)' : ''}}</option>
</select>
</td>
</tr>
这是我的控制器
module CustomerNew.controllers {
export class CreateCustomerCtrl {
static $inject = ['$scope', '$http', '$templateCache'];
debugger;
constructor(protected $scope: ICustomerScope,
protected $http: ng.IHttpService,
protected $templateCache: ng.ITemplateCacheService) {
$scope.listBillingTypeselectedindexchange = this.listBillingTypeselectedindexchange;
}
public listBillingTypeselectedindexchange = (index) = > {
debugger;
var indexvalue = {
BillingTypesindex: index
}
if (index === "3" || index === "4" || index === "5") this.$http.put(dolistsalesindex, indexvalue).
success((data, status, headers, config) = > {
debugger;
this.$scope.listParentAccount = data["listParentAccount"];
}).
error((data, status) = > {
debugger;
console.log("In Error:-in index");
alert(data);
});
}
}
如果选择的索引值是 3、4、5,我希望它只会进入我的 api,否则将 return 空白。
尝试
<table style="width: 144% ! important;" class="TableStyle1" id="Table1" cellspacing="0" cellpadding="2" border="0">
<tr>
<td>Billing Type:</td>
<td ng-if="custom.listBillingType !== '1'"> // if condition
<select id="listBillingType" >
// your options
</select>
</td>
<td ng-if="custom.listBillingType === '1'"> // else condition
<select id="listBillingType" >
// your options
</select>
</td>
</tr>
我已经通过以下方式或通过更改我的打字稿解决了这个问题,或者 angular controller.But 仍然对如何在 ng-change 上重置下拉菜单感到困惑。
public listBillingTypeselectedindexchange = (index) => {
debugger;
var indexvalue = {
BillingTypesindex: index
}
if (index === "3" || index === "4" || index === "5") {
this.$http.put(dolistsalesindex, indexvalue).
success((data, status, headers, config) => {
debugger;
this.$scope.listParentAccount = data["listParentAccount"];
}).
error((data, status) => {
debugger;
console.log("In Error:-in index");
alert(data);
});
}
我正在尝试在 angular 中实现一个 if else 条件 controller.I 已经采取了下拉菜单并且在其索引更改时我正在绑定我的另一个下拉菜单 down.I 已经尝试过 ng-if也是,但它会隐藏整个下拉菜单,我希望下拉菜单可见。这是我的 html 代码:-
<div data-ng-app="CustomerNew" data-ng-controller="CreateCustomerCtrl as custom" ng-init="getFormData();">
<table style="width: 144% ! important;" class="TableStyle1" id="Table1" cellspacing="0" cellpadding="2" border="0">
<tr>
<td>Billing Type:</td>
<td>
<select id="listBillingType" ng-change="listBillingTypeselectedindexchange(custom.listBillingType)" data-ng-options="blngtype as blngtypee for (blngtype,blngtypee) in listBillingType" data-ng-model="custom.listBillingType" style="width: 182px !important; height: 34px;">
<option value="">Choose an option {{optional ? '(optional)' : ''}}</option>
</select>
</td>
</tr>
我试图根据上述下拉索引填充另一个下拉列表。
<tr>
<td nowrap style="height: 26px">Parent Account:</td>
<td style="height: 26px">
<select id="listParentAccount" data-ng-options="prntact as prntact.AccountNumber +' - '+ prntact.FullName for prntact in listParentAccount" ng-model="custom.listParentAccount" style="width: 182px !important; height: 34px;">
<option value="">Choose an option {{optional ? '(optional)' : ''}}</option>
</select>
</td>
</tr>
这是我的控制器
module CustomerNew.controllers {
export class CreateCustomerCtrl {
static $inject = ['$scope', '$http', '$templateCache'];
debugger;
constructor(protected $scope: ICustomerScope,
protected $http: ng.IHttpService,
protected $templateCache: ng.ITemplateCacheService) {
$scope.listBillingTypeselectedindexchange = this.listBillingTypeselectedindexchange;
}
public listBillingTypeselectedindexchange = (index) = > {
debugger;
var indexvalue = {
BillingTypesindex: index
}
if (index === "3" || index === "4" || index === "5") this.$http.put(dolistsalesindex, indexvalue).
success((data, status, headers, config) = > {
debugger;
this.$scope.listParentAccount = data["listParentAccount"];
}).
error((data, status) = > {
debugger;
console.log("In Error:-in index");
alert(data);
});
}
}
如果选择的索引值是 3、4、5,我希望它只会进入我的 api,否则将 return 空白。
尝试
<table style="width: 144% ! important;" class="TableStyle1" id="Table1" cellspacing="0" cellpadding="2" border="0">
<tr>
<td>Billing Type:</td>
<td ng-if="custom.listBillingType !== '1'"> // if condition
<select id="listBillingType" >
// your options
</select>
</td>
<td ng-if="custom.listBillingType === '1'"> // else condition
<select id="listBillingType" >
// your options
</select>
</td>
</tr>
我已经通过以下方式或通过更改我的打字稿解决了这个问题,或者 angular controller.But 仍然对如何在 ng-change 上重置下拉菜单感到困惑。
public listBillingTypeselectedindexchange = (index) => {
debugger;
var indexvalue = {
BillingTypesindex: index
}
if (index === "3" || index === "4" || index === "5") {
this.$http.put(dolistsalesindex, indexvalue).
success((data, status, headers, config) => {
debugger;
this.$scope.listParentAccount = data["listParentAccount"];
}).
error((data, status) => {
debugger;
console.log("In Error:-in index");
alert(data);
});
}