jquery与angular的交互

HTML:

<table class="table table-striped" ng-app="myApp">
            <tr>
                <th>时间</th>
                <th>教练员</th>
                <th>学员</th>
                <th>车牌号</th>
                <th>SIM</th>
                <th>经度</th>
                <th>纬度</th>
                <th>方向</th>
                <th>速度(km/h)</th>
                <th>操作</th>
            </tr>
            <tr ng-controller="myCtrl">
                <td>{{obj.gpsTime}}</td>
                <td>{{obj.coachName}}</td>
                <td>{{obj.studentName}}</td>
                <td>{{obj.licnum}}</td>
                <td>{{obj.sim}}</td>
                <td>{{obj.lng}}</td>
                <td>{{obj.lat}}</td>
                <td>{{obj.direct}}</td>
                <td>{{obj.speed}}</td>
                <td><a title="立即拍照" href="#" class="ljpz"><i class="fa fa-camera"></i></a></td>
            </tr>
        </table>

JS:

1. angular(不能放在jquery的onready事件中)

var app = angular.module(‘myApp‘, []);
app.controller(‘myCtrl‘, function($scope) {
    $scope.obj = {
        gpsTime : ‘‘,
        coachName : ‘‘,
        studentName : ‘‘,
        licnum : ‘‘,
        sim : ‘‘,
        lng : ‘‘,
        lat : ‘‘,
        direct : ‘‘,
        speed : ‘‘
    };
});

2.jquer

Technorati Tags: js,jquery,angular

y(可以放在一个函数或ready事件中)

var scope = $(‘tr[ng-controller="myCtrl"]‘).scope();// 获得angular的作用域
        scope.obj.coachName = ‘hi‘;
        scope.$apply();// 绑定到视图

相关推荐