我正在使用角度JS进行项目,我需要制作一个单选按钮列表,以允许用户更改底图。但我得到的列表没有单选按钮的圆圈。我的控制器是这样的:
(function() {
'use strict';
angular
.module('gdrtApp')
.controller('MapController', MapController);
MapController.$inject = ['$scope', '$http', 'olData'];
function MapController ($scope, $http, olData) {
angular.extend($scope, {
center: {
lat: 47.383474,
lon: 1.329346,
zoom: 6,
autodiscover: true
},
layers: [
{
name: 'OpenStreetMap',
active: true,
source: {
type: 'OSM',
url: "http://{a-c}.tile.openstreetmap.org/{z}/{x}/{y}.png",
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}
},
{
name: 'Stamen',
active: false,
source: {
type: 'Stamen',
layer: 'terrain'
}
},
{
name: 'Bing Maps Road',
active: false,
source: {
name: 'Bing Maps',
type: 'BingMaps',
key: 'Aj6XtE1Q1rIvehmjn2Rh1LR2qvMGZ-8vPS9Hn3jCeUiToM77JFnf-kFRzyMELDol',
imagerySet: 'Road'
}
},
{
name: 'Mapbox Geography Class',
active: false,
source: {
type: 'TileJSON',
url: 'http://api.tiles.mapbox.com/v3/mapbox.geography-class.jsonp'
}
}
],
changeLayer: function(layer) {
$scope.layers.map(function(l) {
l.active = (l === layer);
});
}
});
}
})();
我的html文件如下所示:
<nav id="couches">
<md-radio-group>
<md-radio-button ng-repeat="layer in layers" ng-click="changeLayer(layer)">{{ layer.name }}<br/></md-radio-button>
</md-radio-group>
</nav>
当我执行时,我只获得图层名称的列表,当我点击图层的名称时,我正确地看到图层。但没有单选按钮!我该怎样解决这个问题?