我是Angular的新手,但我开始做任务,我正在寻求设计方面的帮助。
我需要在每次选择更新时在页面上添加一个蓝色框。
的index.html
<div class="col-md-3 col-md-offset-9" ng-controller="selectController">
<select class="form-control"
ng-model="selectedItem"
ng-options="item.Title for item in items"
ng-change="clickOnOption()">
<option label="" value="">Nothing selected</option>
</select>
</div>
<div class=" col-md-12 boxes-container"></div>
app.js
// MODULE
var creatorApp = angular.module('creatorApp', []);
// CONTROLLERS
creatorApp.controller('selectController', ['$scope', function ($scope) {
$scope.items = [
{ID: '1', Title: 'Plan 1'},
{ID: '2', Title: 'Plan 2'},
{ID: '3', Title: 'Plan 3'},
{ID: '4', Title: 'Plan 4'},
];
$scope.selectedItem = '';
$scope.clickOnOption = function(){
console.log($scope.selectedItem.Title);
//old noble jquery
$('.boxes-container').append('<div class="col-md-3" style="height: 30em; background-color:#0000FF;"></div><div class="col-md-1"></div>');
};
}]);
所以我觉得我的代码出错了,我开始再次使用jquery,看起来我需要使用指令或类似的东西。但我怎么理解我应该在我的情况下使用指令。
对不起我的noob问题。但我真的对Angular中的指令感到困惑。
更新 对不起,但我没有在相关主题中看到新的东西。 从主题:如果您不知道,请询问!