首页 > 解决方案 > JQuery 调用在我的 AngularJS 页面中不起作用

问题描述

我项目的此页面中的 JQuery 选择器不起作用,它们调用自动完成方法和日期选择器的方式与其他正常工作的页面相同。

这是我的代码,我反复查看了 420 次。

如果我尝试填充输入字段,则应在 dati.js 中调用 get 方法,但似乎 $ 选择器不起作用,因为 .datepicker 也不起作用

控制器

angular.module('AceApp').controller('praticaCtrl', function($scope, $window, $http, $timeout, $rootScope, $state, $stateParams, $location, $auth, $uibModal, dati, $compile, $filter) {
    $( ".datapicker" ).datepicker({
        changeMonth: true,
        changeYear: true,
        yearRange: "1900:2050",
        dateFormat: 'dd-mm-yy'
});
$(".dataPickerModal").datepicker({
    changeMonth: true,
    changeYear: true,
    yearRange: "1900:2050",
    dateFormat: 'dd-mm-yy'
}).css({"z-index":10000});
////////////
$("#luogoNascita").autocomplete({
    source: function (request, resolve) {
        console.log("vvv");
        dati.getCitta(request.term)
            .success(function (data) {
               resolve(data);
            })
            .error(function () {
            });
        }
    });

$("#luogoNascita").on("autocompleteselect", function(event, ui) {
    $timeout(function() {
        $scope.cliente.comune_nascita.sigla = ui.item.sigla;
        $scope.cliente.comune_nascita.codice_catastale = ui.item.codiceCatastale;
    });
}); ETC...

HTML

<div class="col-md-3 col-sm-3 col-xs-7">
    <label for="luogoNascita">Luogo di Nascita</label>
    <input ng-model = "cliente.comune_nascita.nome" autocomplete = "on" 
           type="text" class="form-control" name="luogoNascita"
           id="luogoNascita" placeholder="Ricerca Città" style="width:100%" />
</div>

APP.JS

.state('pratica', {
    url: '/pratica/:id',
    title: 'Dati anagrafici',
    icon: 'fa fa-dollar',
    view: false,
    sottomenu: false,
    templateUrl: 'views/pages/pratiche/pratica.html',
    permissions: 'quinto-stipendio_pratica',
    controller: 'praticaCtrl',
    resolve: {
        lazyLoad: ['$ocLazyLoad', function($ocLazyLoad) {
            return $ocLazyLoad.load([
                {
                    serie: true,
                    name: 'dataTables',
                    files: ['../components/datatables/media/js/jquery.dataTables.js', '../components/_mod/datatables/jquery.dataTables.bootstrap.js', '../components/angular-datatables/dist/angular-datatables.js']
                },
                {
                    name: 'AceApp',
                    files: ['js/controllers/pages/pratiche/pratica.js']
                },
                {
                    name: 'stepF',
                    files: ['js/controllers/pages/dropzone/uploader.js']
                }
            ]);
        }]
    },
    permissions: 'leggi-cessione_quinto'
})

我只是从它工作的其他页面复制粘贴此代码,并且没有任何区别。

标签: javascriptjqueryangularjs

解决方案


好吧..你不能只在 AngularJS 中使用 $()。

有结合jquery和angularjs的解决方案


推荐阅读