Search Posts

Category: angular-material

AngularJS md-autocomplete return all possible substrings

I’m using md-autocomplete to let users search through subjects at my university. The problem is my search function only searches sequentially (left to right) through each display value. For example: If I search “Arts and Architecture” I get “no results found”, which I do not want to happen. I would like “Arts and Architecture” to return a result. The subjects are in this format: $scope.subjects = [ { value: ‘AA’, display: ‘AA – Arts and […]

md-selected-item show’s VALUE how to force md-selected-item to show KEY for pre-entered(Value coming from DB) values

I am using following code <table class=”table”> <thead> <tr> <th>State Name</th> <th> </tr> </thead> <tbody> <tr ng-repeat=”displayPerState in $ctrl.displayPerStates “> <td> <md-autocomplete md-autofocus=”true” md-no-cache=”true” md-selected-item=”$ctrl.displayPerState[$index].stateName” md-search-text=”searchText” md-items=”item in $ctrl.querySearch(searchText)” md-item-text=”item.display” md-min-length=”0″ ng-disabled=”$ctrl.Edit[$index]” placeholder=”Select State”> <md-item-template> <span md-highlight-text=”searchText” md-highlight-flags=”^i”>{{item.display}}</span> </md-item-template> </md-autocomplete> </td> for e.g. instead us_alabama it should come US Albama in md-seleted-item[For Preentered values i.e. in DB it is us_alabama] Here is my JSON file which is used as Suggestions container for md-autocomplete { “US […]

angular material md-select ng-model set to undefined rules

When I execute this script, aForm.aField.$error contains {“required”:true} BUT $scope.fruit is not set to undefined even though it is not in the md-option values. So the “required” validation is done but not the set to undefined. <!doctype html> <html ng-app=”anApp”> <head> <link rel=”stylesheet” href=”bower_components/angular-material/angular-material.min.css”> <script src=”bower_components/angular/angular.js”></script> <script src=”bower_components/angular-messages/angular-messages.min.js”></script> <script src=”bower_components/angular-material/angular-material.js”></script> <script src=”bower_components/angular-animate/angular-animate.min.js”></script> <script src=”bower_components/angular-aria/angular-aria.min.js”></script> <script> angular.module(‘anApp’, [‘ngMessages’, ‘ngMaterial’]) .controller(‘aController’, function ($scope, $timeout) { $scope.fruitBasket = [{name:”apple”, id:1}]; $scope.fruit = 100; $scope.required = true; }); </script> […]