Как использовать md-select с использованием данных массива?

Question

Я использую угловые и угловые материалы для создания моей веб-страницы. Я не могу показать значения параметра, присутствующие в массиве.

Мои index.html

<md-input-container class="md-block" flex-gt-sm> 
    <label>Level</label> 
    {{levels|json}} 
    <ul> 
     <li ng-repeat="level in levels"> {{level.name}}</li><!--this is working--> 
    </ul> 
    <md-select ng-model="news.level"> 
     <md-option ng-repeat="level in levels"ng-value="level.name"> 
     {{level.name}} 
     </md-option><!--this is not working--> 
    </md-select> 
</md-input-container> 

И в контроллере у меня есть

$scope.levels=['Level one', 'Level two','Level Three']; 

Пожалуйста, помогите, что могло бы быть неправильным, а также дайте мне знать о любых предложений к этой проблеме.

Answer 1

Здесь вы идете - CodePen

Markup

<div ng-controller="AppCtrl" ng-cloak="" ng-app="MyApp"> 
    <md-input-container class="md-block" flex-gt-sm> 
    <label>Level</label> 
    <ul> 
     <li ng-repeat="level in levels"> {{level.name}}</li> 
    </ul> 
    <md-select ng-model="news.level"> 
     <md-option ng-repeat="level in levels" ng-value="level.name"> 
     {{level.name}} 
     </md-option> 
    </md-select> 
    </md-input-container> 
</div> 

JS

angular.module('MyApp',['ngMaterial', 'ngMessages', 'material.svgAssetsCache', 'ngDialog']) 

.controller('AppCtrl', function($scope) { 
    $scope.levels = [{name:'Level one'}, {name:'Level two'}, {name:'Level Three'}]; 
});