angular.min.js无法正确加载jquery

时间:2015-01-19 05:07:46

标签: html angularjs

我试图使用jquery load将html页面加载到另一个视图中的div。

$("#sideMenuCustomerDivition").click(function (e) {
    e.preventDefault();
    $('#subContents').load('Main/Customer');
});

这是我的HTML

<div class="contents" id="subContents">

</div>
<!-- CDN JavaScript Links-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
<!-- end-->

我已将html表放在我的其他视图中并尝试使用angular将数据加载到该表。但我的桌子显示如下 enter image description here 这是我加载视图的javascript

    angular.module('myApp', ['smart-table']).controller('safeCtrl', ['$scope', function ($scope) {

    var firstnames = ['Laurent', 'Blandine', 'Olivier', 'Max'];
    var lastnames = ['Renard', 'Faivre', 'Frere', 'Eponge'];
    var dates = ['1987-05-21', '1987-04-25', '1955-08-27', '1966-06-06'];
    var id = 1;

    function generateRandomItem(id) {

        var firstname = firstnames[Math.floor(Math.random() * 3)];
        var lastname = lastnames[Math.floor(Math.random() * 3)];
        var birthdate = dates[Math.floor(Math.random() * 3)];
        var balance = Math.floor(Math.random() * 2000);

        return {
            id: id,
            firstName: firstname,
            lastName: lastname,
            birthDate: new Date(birthdate),
            balance: balance
        }
    }

    $scope.rowCollection = [];

    for (id; id < 5; id++) {
        $scope.rowCollection.push(generateRandomItem(id));
    }

    //copy the references (you could clone ie angular.copy but then have to go through a dirty checking for the matches)
    $scope.displayedCollection = [].concat($scope.rowCollection);

    //add to the real data holder
    $scope.addRandomItem = function addRandomItem() {
        $scope.rowCollection.push(generateRandomItem(id));
        id++;
    };

    //remove to the real data holder
    $scope.removeItem = function removeItem(row) {
        var index = $scope.rowCollection.indexOf(row);
        if (index !== -1) {
            $scope.rowCollection.splice(index, 1);
        }
    }
}]);

这是html

 <table st-table="rowCollection" class="table table-striped">
    <thead>
        <tr>
            <th>first name</th>
            <th>last name</th>
            <th>birth date</th>
            <th>balance</th>
            <th>email</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="row in rowCollection">
            <td>{{row.firstName}}</td>
            <td>{{row.lastName}}</td>
            <td>{{row.birthDate}}</td>
            <td>{{row.balance}}</td>
            <td>{{row.email}}</td>
        </tr>
    </tbody>
</table>
<script src="~/Scripts/CustomerView.js"></script>

0 个答案:

没有答案