{"action":"created","issue":{"url":"https://api.github.com/repos/angular/material/issues/2333","labels_url":"https://api.github.com/repos/angular/material/issues/2333/labels{/name}","comments_url":"https://api.github.com/repos/angular/material/issues/2333/comments","events_url":"https://api.github.com/repos/angular/material/issues/2333/events","html_url":"https://github.com/angular/material/issues/2333","id":68698708,"number":2333,"title":"contact chips search box is not display ","user":{"login":"johnlim5847","id":3675946,"avatar_url":"https://avatars.githubusercontent.com/u/3675946?v=3","gravatar_id":"","url":"https://api.github.com/users/johnlim5847","html_url":"https://github.com/johnlim5847","followers_url":"https://api.github.com/users/johnlim5847/followers","following_url":"https://api.github.com/users/johnlim5847/following{/other_user}","gists_url":"https://api.github.com/users/johnlim5847/gists{/gist_id}","starred_url":"https://api.github.com/users/johnlim5847/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/johnlim5847/subscriptions","organizations_url":"https://api.github.com/users/johnlim5847/orgs","repos_url":"https://api.github.com/users/johnlim5847/repos","events_url":"https://api.github.com/users/johnlim5847/events{/privacy}","received_events_url":"https://api.github.com/users/johnlim5847/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":{"login":"robertmesserle","id":571363,"avatar_url":"https://avatars.githubusercontent.com/u/571363?v=3","gravatar_id":"","url":"https://api.github.com/users/robertmesserle","html_url":"https://github.com/robertmesserle","followers_url":"https://api.github.com/users/robertmesserle/followers","following_url":"https://api.github.com/users/robertmesserle/following{/other_user}","gists_url":"https://api.github.com/users/robertmesserle/gists{/gist_id}","starred_url":"https://api.github.com/users/robertmesserle/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/robertmesserle/subscriptions","organizations_url":"https://api.github.com/users/robertmesserle/orgs","repos_url":"https://api.github.com/users/robertmesserle/repos","events_url":"https://api.github.com/users/robertmesserle/events{/privacy}","received_events_url":"https://api.github.com/users/robertmesserle/received_events","type":"User","site_admin":false},"milestone":{"url":"https://api.github.com/repos/angular/material/milestones/15","html_url":"https://github.com/angular/material/milestones/0.10.0","labels_url":"https://api.github.com/repos/angular/material/milestones/15/labels","id":958568,"number":15,"title":"0.10.0","description":"### Specification Efforts\r\n\r\nThe following tasks need design notes: present the problem and identify solution(s):\r\n\r\n- menu\r\n- chips\r\n- slider range\r\n- icon buttons\r\n- textfields\r\n  *  `<md-text-search>`\r\n\r\n#### Design + Research\r\n- virtual repeat\r\n- data tables \r\n- date picker\r\n\r\n### Additional Efforts\r\n\r\nImplementation of an online Angular Material build tool (and API) that supports customized output for:\r\n\r\n- bi-directional support.\r\n- global theming and component theme overrides\r\n- select 1 or more specific components to bundle\r\n- selection of icons and svgs to bundle","creator":{"login":"ThomasBurleson","id":210413,"avatar_url":"https://avatars.githubusercontent.com/u/210413?v=3","gravatar_id":"","url":"https://api.github.com/users/ThomasBurleson","html_url":"https://github.com/ThomasBurleson","followers_url":"https://api.github.com/users/ThomasBurleson/followers","following_url":"https://api.github.com/users/ThomasBurleson/following{/other_user}","gists_url":"https://api.github.com/users/ThomasBurleson/gists{/gist_id}","starred_url":"https://api.github.com/users/ThomasBurleson/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ThomasBurleson/subscriptions","organizations_url":"https://api.github.com/users/ThomasBurleson/orgs","repos_url":"https://api.github.com/users/ThomasBurleson/repos","events_url":"https://api.github.com/users/ThomasBurleson/events{/privacy}","received_events_url":"https://api.github.com/users/ThomasBurleson/received_events","type":"User","site_admin":false},"open_issues":164,"closed_issues":22,"state":"open","created_at":"2015-01-30T17:00:57Z","updated_at":"2015-04-20T02:09:18Z","due_on":"2015-05-12T05:00:00Z","closed_at":null},"comments":4,"created_at":"2015-04-15T14:35:22Z","updated_at":"2015-04-20T09:30:42Z","closed_at":null,"body":"\r\n![screen shot 2015-04-15 at 10 33 29 pm](https://cloud.githubusercontent.com/assets/3675946/7161054/8cb7abf4-e3bf-11e4-8fbf-c73046696f02.png)\r\n\r\nthis is what i got \r\n![screen shot 2015-04-15 at 10 33 41 pm](https://cloud.githubusercontent.com/assets/3675946/7161066/97b14290-e3bf-11e4-9601-15c341f1749e.png)\r\n\r\nmay i know why the contact chips search box is not displayed on my app ? i have follow exactly what the demo site show but i still not able to get the search box display.Do i need to include an autocomplete directive to get it done ?  here's my code\r\n\r\n```javascript\r\nangular.module('app').controller('IndexCtrl', [\r\n  '$scope',\r\n  '$http',\r\n  '$rootScope',\r\n  '$auth',\r\n  'Account',\r\n  '$timeout',\r\n  '$q',\r\n  function ($scope, $http, $rootScope,$auth,Account,$timeout, $q) {\r\n\r\n    $scope.querySearch = querySearch;\r\n    $scope.allContacts = loadContacts();\r\n    $scope.contacts = [$scope.allContacts[0]];\r\n    $scope.filterSelected = true;\r\n    /**\r\n     * Search for contacts.\r\n     */\r\n    function querySearch (query) {\r\n      var results = query ?\r\n          $scope.allContacts.filter(createFilterFor(query)) : [];\r\n      return results;\r\n    }\r\n    /**\r\n     * Create filter function for a query string\r\n     */\r\n    function createFilterFor(query) {\r\n      var lowercaseQuery = angular.lowercase(query);\r\n      return function filterFn(contact) {\r\n        return (contact._lowername.indexOf(lowercaseQuery) != -1);;\r\n      };\r\n    }\r\n    function loadContacts() {\r\n      var contacts = [\r\n        'Marina Augustine',\r\n        'Oddr Sarno',\r\n        'Nick Giannopoulos',\r\n        'Narayana Garner',\r\n        'Anita Gros',\r\n        'Megan Smith',\r\n        'Tsvetko Metzger',\r\n        'Hector Šimek',\r\n        'Some-guy withalongalastaname'\r\n      ];\r\n      return contacts.map(function (c, index) {\r\n        var cParts = c.split(' ');\r\n        var contact = {\r\n          name: c,\r\n          email: cParts[0][0].toLowerCase() + '.' + cParts[1].toLowerCase() + '@example.com',\r\n          image: 'http://lorempixel.com/50/50/people?' + index\r\n        };\r\n        contact._lowername = contact.name.toLowerCase();\r\n        return contact;\r\n      });\r\n    }\r\n    });\r\n  }\r\n]);\r\n```\r\n\r\nin my index.html \r\n\r\n```html\r\n<div layout=\"row\" layout-margin layout-fill layout-padding>\r\n\t\r\n\t<div flex>\r\n\t  <h2 class=\"text-center black\">Tagged yourself</h2>\r\n  <md-content class=\"md-padding autocomplete\" layout=\"column\">\r\n    <p>\r\n      Contact Chips.\r\n    </p>\r\n    <md-contact-chips\r\n        ng-model=\"contacts\"\r\n        md-contacts=\"querySearch($query)\"\r\n        md-contact-name=\"name\"\r\n        md-contact-image=\"image\"\r\n        md-contact-email=\"email\"\r\n        filter-selected=\"filterSelected\"\r\n        placeholder=\"To\">\r\n\r\n    </md-contact-chips>\r\n    <md-checkbox ng-model=\"filterSelected\">Filter selected contacts from options</md-checkbox>\r\n  </md-content>\r\n\r\n\t</div>\r\n</div>\r\n```\r\n\r\n\r\ni got no error on console, however the searchbox is not appear on my app. your help is appreciated \r\n"},"comment":{"url":"https://api.github.com/repos/angular/material/issues/comments/94406803","html_url":"https://github.com/angular/material/issues/2333#issuecomment-94406803","issue_url":"https://api.github.com/repos/angular/material/issues/2333","id":94406803,"user":{"login":"sysupbda","id":8740302,"avatar_url":"https://avatars.githubusercontent.com/u/8740302?v=3","gravatar_id":"","url":"https://api.github.com/users/sysupbda","html_url":"https://github.com/sysupbda","followers_url":"https://api.github.com/users/sysupbda/followers","following_url":"https://api.github.com/users/sysupbda/following{/other_user}","gists_url":"https://api.github.com/users/sysupbda/gists{/gist_id}","starred_url":"https://api.github.com/users/sysupbda/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sysupbda/subscriptions","organizations_url":"https://api.github.com/users/sysupbda/orgs","repos_url":"https://api.github.com/users/sysupbda/repos","events_url":"https://api.github.com/users/sysupbda/events{/privacy}","received_events_url":"https://api.github.com/users/sysupbda/received_events","type":"User","site_admin":false},"created_at":"2015-04-20T09:30:42Z","updated_at":"2015-04-20T09:30:42Z","body":"Hi! What has happened is you are looking at the last version while looking at the demos and documentation (you can see at the top right that the documentation presents v0.9.0-rc), however in your codepen at least you are using https://ajax.googleapis.com/ajax/libs/angular_material/0.8.3/angular-material.min.js which is version 0.8.3 which has no md-chips or md-contact-chips support yet. The beauty and evilness of HTML5 supporting browsers is that they allow you to use tags that it does not recognize without complaining. In this case, even your ngMaterial version does not do anything with it.\r\n\r\nYou could try with https://rawgit.com/angular/bower-material/master/angular-material.js until there is a CDN for this latest version of ngMaterial like I do with http://codepen.io/anon/pen/vOBaQO to continue your development with md-contact-chips"}}