,同时从templateResolver()调用 Ctrl()函数中的内部函数,在TemplateResolver中,我这样调用-------- md-search-text-change = “ ctrl.searchTextChange(ctrl.searchText)” 提示我为什么会出错,或者如何从 templateresolver()
调用该内部函数请输入代码:
angular
.module('app.components')
.directive('dirInput', dirInput);
function dirInput() {
return {
restrict: "E",
scope: {
inputConfig: '<',
model: '=ngModel'
},
require: '^InputBar',
template: templateResolver(),
controller: ctrl
};
// For context
function ctrl($timeout,$scope, $q, $log) {
var self = this;
self.simulateQuery = false;
self.isDisabled = false;
// list of `state` value/display objects
self.states = loadAll();
self.querySearch = querySearch;
self.selectedItemChange = selectedItemChange;
self.searchTextChange = searchTextChange;
self.newState = newState;
function newState(state) {
alert("Sorry! You'll need to create a Constitution for " + state + " first!");
}
// ******************************
// Internal methods
// ******************************
function querySearch (query) {
var results = query ? self.states.filter( createFilterFor(query) ) : self.states,
deferred;
if (self.simulateQuery) {
deferred = $q.defer();
$timeout(function () { deferred.resolve( results ); }, Math.random() * 1000, false);
return deferred.promise;
} else {
return results;
}
}
function searchTextChange(text) {
alert("text "+text)
$log.info('Text changed to ' + text);
}
function selectedItemChange(item) {
$log.info('Item changed to ' + JSON.stringify(item));
}
function loadAll()
{ var allStates = 'Alabama, Alaska, Arizona, Arkansas, California, Colorado, Connecticut, Delaware,\
Florida, Georgia, Hawaii, Idaho, Illinois, Indiana, Iowa, Kansas, Kentucky, Louisiana,\
Maine, Maryland, Massachusetts, Michigan, Minnesota, Mississippi, Missouri, Montana,\
Nebraska, Nevada, New Hampshire, New Jersey, New Mexico, New York, North Carolina,\
North Dakota, Ohio, Oklahoma, Oregon, Pennsylvania, Rhode Island, South Carolina,\
South Dakota, Tennessee, Texas, Utah, Vermont, Virginia, Washington, West Virginia,\
Wisconsin, Wyoming';
return allStates.split(/, +/g).map( function (state) {
return {
value: state.toLowerCase(),
display: state
};
});
}
/**
* Create filter function for a query string
*/
function createFilterFor(query) {
var lowercaseQuery = query.toLowerCase();
return function filterFn(state) {
return (state.value.indexOf(lowercaseQuery) === 0);
};
}
}
function templateResolver() {
var templateString =
' <md-input-container class="md-accent">\n' +
' <label>{{ inputConfig.label }}</label>\n' +
' <input ng-if="inputConfig.type === \'text\'" name="{{inputConfig.id}}" ng-model="$parent.model" ng-blur="onBlur($event)" ng-required="{{inputConfig.required}}">\n' +
' <md-datepicker ng-if="inputConfig.type === \'date\'" ng-model="$parent.model" md-hide-icons="calendar" ng-required="{{inputConfig.required}}"></md-datepicker>\n' +
' <md-autocomplete ng-if="inputConfig.type === \'auto-complete\'" name="{{inputConfig.id}}" ng-required="{{inputConfig.required}}" ng-disabled="ctrl.isDisabled" md-no-cache="ctrl.noCache" md-selected-item="ctrl.selectedItem" md-search-text-change="ctrl.searchTextChange(ctrl.searchText)" md-search-text="ctrl.searchText" md-selected-item-change="ctrl.selectedItemChange(item)" md-items="item in ctrl.querySearch(ctrl.searchText)" md-item-text="item.display" md-min-length="0" ><md-item-template> <span md-highlight-text="ctrl.searchText" md-highlight-flags="^i">{{item.display}}</span></md-item-template></md-autocomplete> \n'+
' </md-input-container>';
return templateString;
}
}