我有一个国家和州选择的依赖下拉。州下降取决于国家选择。实际上我在一个单独的文件模块中为它创建了一个指令。以下是这个。因此,当我进入编辑页面进行编辑时,则不会选择任何状态显示。 基本上我只想将所选国家从控制器传递到指令。如果我得到这个,那么我只需从指令加载相应的状态值。请帮助任何人。它的解决方案是什么? 在此先感谢:)
function(window) {
"use strict";
var template = '<div class="control-group">'
template += '<label for="country" class="control-label">{{countryLabel}}</label>';
template += '<div class="controls" val="{{ngModel.country}}">';
template += '<select name="country" ng-change="selectCountry()" ng-model="ngModel.country" required class="form-control">';
template += '<option value="">Select Country</option>';
template +='<option ng-repeat="theCountry in countries track by $index" >{{theCountry}}</option>';
template +='</select>';
template +='</div>';
template +='</div>';
template += '<div class="control-group">';
template += '<label for="country" class="control-label">{{stateLabel}}</label>';
template += '<div class="controls">';
template += '<select name="state" ng-model="ngModel.county" ng-disabled="!ngModel.country" required class="form-control">';
template += '<option value="">Select State</option>';
template +='<option ng-repeat="optStates in states track by $index">{{optStates}}</option>';
template +='</select>';
template +='</div>';
template +='</div>';
angular
.module("angularCountryState")
.directive("countryStateSelect", [ function () {
return {
restrict: "E",
template: template,
scope: { country: "=", countryState: "=?state", ngModel: '='},
link: function (scope, element, attrs) {
scope.countryLabel = "Country";
scope.stateLabel = "State";
if(typeof attrs.countryLabel != 'undefined'){
scope.countryLabel = attrs.countryLabel;
}
if(typeof attrs.stateLabel != 'undefined'){
scope.stateLabel = attrs.stateLabel;
}
alert(scope.country);
scope.countries = new Array("Afghanistan", "Albania", "Algeria", "American Samoa", "Angola", "Anguilla");
scope.state = new Array();
scope.state[1]="Badakhshan|Badghis|Baghlan|Balkh|Bamian|Farah|Faryab|Ghazni|Ghowr|Helmand|Herat|Jowzjan|Kabol|Kandahar|Kapisa|Konar|Kondoz|Laghman|Lowgar|Nangarhar|Nimruz|Oruzgan|Paktia|Paktika|Parvan|Samangan|Sar-e Pol|Takhar|Vardak|Zabol";
scope.state[2]="Berat|Bulqize|Delvine|Devoll (Bilisht)|Diber (Peshkopi)|Durres|Elbasan|Fier|Gjirokaster|Gramsh|Has (Krume)|Kavaje|Kolonje (Erseke)|Korce|Kruje|Kucove|Kukes|Kurbin|Lezhe|Librazhd|Lushnje|Malesi e Madhe (Koplik)|Mallakaster (Ballsh)|Mat (Burrel)|Mirdite (Rreshen)|Peqin|Permet|Pogradec|Puke|Sarande|Shkoder|Skrapar (Corovode)|Tepelene|Tirane (Tirana)|Tirane (Tirana)|Tropoje (Bajram Curri)|Vlore";
scope.state[3]="Adrar|Ain Defla|Ain Temouchent|Alger|Annaba|Batna|Bechar|Bejaia|Biskra|Blida|Bordj Bou Arreridj|Bouira|Boumerdes|Chlef|Constantine|Djelfa|El Bayadh|El Oued|El Tarf|Ghardaia|Guelma|Illizi|Jijel|Khenchela|Laghouat|M'Sila|Mascara|Medea|Mila|Mostaganem|Naama|Oran|Ouargla|Oum el Bouaghi|Relizane|Saida|Setif|Sidi Bel Abbes|Skikda|Souk Ahras|Tamanghasset|Tebessa|Tiaret|Tindouf|Tipaza|Tissemsilt|Tizi Ouzou|Tlemcen";
scope.state[4]="Eastern|Manu'a|Rose Island|Swains Island|Western";
scope.state[5]="Andorra la Vella|Bengo|Benguela|Bie|Cabinda|Canillo|Cuando Cubango|Cuanza Norte|Cuanza Sul|Cunene|Encamp|Escaldes-Engordany|Huambo|Huila|La Massana|Luanda|Lunda Norte|Lunda Sul|Malanje|Moxico|Namibe|Ordino|Sant Julia de Loria|Uige|Zaire";
scope.selectCountry = function(){
var selectedCountry = scope.ngModel.country;
var indexCountry = scope.countries.indexOf(selectedCountry)+1;
scope.states = scope.state[indexCountry].split("|");
scope.countryState = '';
if(scope.states.length == 1){
scope.states = new Array(selectedCountry);
}
//indexCountry correspond to the "Select" label
if(indexCountry == 0){
scope.states = new Array("");
}
}
// scope.selectCountry();
}
};
}]);
}());
app.controller('EmployeeloanCtrl', function ($scope, $rootScope, $routeParams, Restangular, showAlertSrvc, ngTableParams, $filter, listService, $location, $cookieStore){
//This Function Is Use To Get The Detail Of The User Also Update The Detail.
$scope.getUserDetail = function(){
Restangular.one('users', uid).get({is_archived:'0'}).then(function(user){
$scope.country = "india";
$scope.user = user;
//This Function Is Use To Update The User Personal Details.
$scope.editUserinfo = function(user){
Restangular.one('users', uid).customPUT(user).then(function(responce){
$location.path('/employee/loan/addloaninfo');
});
};
});
};
});
<form ng-submit="editAccount(user)" class="form-horizontal">
<fieldset>
<div class="control-group">
<label for="password" class="control-label">Password</label>
<div class="controls">
<span ng-controller="modalpchangeCtrl as ctrl">
<a class="btn btn-small btn-success" ng-click="ctrl.showModal(notification._id,'sender_id')">Change Password</a>
</span>
</div> <!-- /controls -->
</div> <!-- /control-group -->
<div class="control-group">
<label for="first name" class="control-label">First Name</label>
<div class="controls">
<input type="text" class="span4" placeholder="First Name" ng-model="user.first_name" ng-required="true">
</div> <!-- /controls -->
</div> <!-- /control-group -->
<div class="control-group">
<label for="middle name" class="control-label">Middle Name</label>
<div class="controls">
<input type="text" class="span4" placeholder="Middle Name" ng-model="user.middle_name" ng-required="true">
</div> <!-- /controls -->
</div> <!-- /control-group -->
<div class="control-group">
<label for="last name" class="control-label">Last Name</label>
<div class="controls">
<input type="text" class="span4" placeholder="Last Name" ng-model="user.last_name" ng-required="true">
</div> <!-- /controls -->
</div> <!-- /control-group -->
<div class="control-group">
<label for="email" class="control-label">Email</label>
<div class="controls">
<input type="text" class="span4" ng-readonly="true" placeholder="Email" ng-model="user.email" ng-required="true">
</div> <!-- /controls -->
</div> <!-- /control-group -->
<div class="control-group">
<label for="phone" class="control-label">Address line 1</label>
<div class="controls">
<input type="text" class="span4" placeholder="address line 1" ng-model="user.address_line_1" ng-required="true">
</div> <!-- /controls -->
</div> <!-- /control-group -->
<div class="control-group">
<label for="phone" class="control-label">Address line 2</label>
<div class="controls">
<input type="text" class="span4" placeholder="address line 2" ng-model="user.address_line_2" ng-required="true">
</div> <!-- /controls -->
</div> <!-- /control-group -->
<country-state-select ng-model="user"></country-state-select>
<div class="control-group">
<label for="city" class="control-label">City</label>
<div class="controls">
<input type="text" class="span4" placeholder="city" ng-model="user.city">
</div> <!-- /control-group -->
</div>
<div class="control-group">
<label for="post_code" class="control-label">Post code</label>
<div class="controls">
<input type="text" class="span4" placeholder="post code" ng-model="user.post_code" ng-required="true">
</div> <!-- /controls -->
</div> <!-- /control-group -->
<div class="control-group">
<div class="form-actions">
<button class="btn btn-primary" type="submit">Save</button>
<a class="btn" href="/#/">Cancel</a>
</div> <!-- /form-actions -->
</fieldset>
</form>
我也看起来是一个吸引人的链接http://plnkr.co/edit/gp0zIwnj9Oz3IpQPXhDI?p=preview。 我只想要从控制器设置的数据我希望得到警报。