如何在AngularJS中插入新元素

Question

我是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,它看起来像我需要使用指令或类似的东西.但我怎么理解我应该在我的情况下使用指令.

对不起我的菜鸟问题.但我真的对Angular中的指令感到困惑.

更新 抱歉,但在相关主题中我没有看到任何新内容.来自话题:如果你不知道,请问!