如何在AngularJS中插入新元素

时间:2015-10-21 04:33:23

标签: javascript jquery angularjs

我是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中的指令感到困惑。

更新 对不起,但我没有在相关主题中看到新的东西。 从主题:如果您不知道,请询问!

0 个答案:

没有答案