如何在bootsrap元素

时间:2016-06-30 11:02:41

标签: html angularjs angular-ui-bootstrap gridster

我正在尝试根据从http请求服务获得的响应来制作动态创建的切片。

我的html页面看起来像这样

    <div class="container-fluid" >
<div class="col-sm-3 col-lg-3 col-md-3 backlog well" style="margin-left:160px">
    <div class="subjectCenter"><h2>Backlog<i class="fa fa-cog fa-fw" aria-hidden="true" style="float:right"></i></h2>
    </div>
    <div id="spacefortask">
    <addtask></addtask>
    </div>
    </div>
    <div class="col-sm-3 col-lg-3 col-md-3 backlog well">
            <div class="subjectCenter"><h2>In Progress</h2></div>

    </div>
    <div class="col-sm-3 col-lg-3 col-md-3 backlog well">
            <div class="subjectCenter"><h2>Done</h2>


        </div>

    </div>


</div>

我的Angular js文件是

var myApp = angular.module('myApp',['myApp.filters','gridster']);

myApp.component('addtask', {
templateUrl: '/src/views/index.html',

});

和index.html页面是

<div ng-app="myApp" ng-controller="myNokiaController">
        <div ng-repeat="task in myWelcome" class="well">
<div gridster>
    <ul>
    <li gridster-item="item" ng-repeat="item in standardItems">
        <div>
    <h1>{{task.taskData}}</h1>
    <h2>{{task.member}}</h2>
        <h3>{{task.time}}</h3>
            </div>
    </li>
    </ul>

</div>
</div>
</div>

假设我从http响应获取myWelcome中的数据,并且我已将standardItems设置为

    $scope.standardItems = [ { sizeX: 1, sizeY: 1, row: 1, col: 1 }];

对于myWelocome中的每个条目,我想创建一个tile,以便我只在standardItems中给出一个条目。 足够的编码,我正在解释我想做什么 所以现在我能够创建瓷砖,但它们不是可拖动的,它们是静态的,所以我不知道它为什么会发生。 如果有人建议我如何使这些项目可拖动以便它可以移动到另一个引导列(如在第一个html示例中),那会更好。

0 个答案:

没有答案