0

大家好。我正在使用带有 ui.router 的 anguarjs 开发一个应用程序。我面临的问题是,当我的应用程序启动时一切正常,但是当我从标题导航页面时,我的 jquery 插件停止工作。

这是我的代码

索引.HTML

<!DOCTYPE html>
<html lang="en-US" ng-app="SMH">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="ThemeStarz">
<link href="assets/fonts/font-awesome.css" rel="stylesheet" type="text/css"      />
<link href="assets/fonts/elegant-fonts.css" rel="stylesheet" type="text/css" />
<link href='https://fonts.googleapis.com/css?family=Lato:400,300,700,900,400italic' rel='stylesheet' type='text/css' />
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.css" type="text/css" />
<link href="assets/css/bootstrap-select.min.css" rel="stylesheet" />
<link rel="stylesheet" href="assets/css/zabuto_calendar.min.css" type="text/css" />
<link rel="stylesheet" href="assets/css/owl.carousel.css" type="text/css" />
<link rel="stylesheet" href="assets/css/trackpad-scroll-emulator.css" type="text/css" />
<link rel="stylesheet" href="assets/css/style.css" type="text/css" />
<title>Locations - Directory Listing HTML Template</title>
<!--<base href="/">-->
</head>
<body class="homepage">
<div class="page-wrapper">
    <header id="page-header">
        <nav>
            <div class="left">
                <a href="index.html" class="brand">
                 <img src="assets/img/logo.png" alt=""></a>
            </div>
            <!--end left-->
            <div class="right">
                <div class="primary-nav has-mega-menu">
                    <ul class="navigation">
                        <li><a href="" ui-sref="home">Home</a></li>
                        <li><a href="" ui-sref="blog">Blog</a></li>
                        <li><a href="">Contact</a></li>
                    </ul>
                    <!--end navigation-->
                </div>
                <!--end primary-nav-->
                <div class="secondary-nav">
                    <a href="#" data-modal-external-file="modal_sign_in.php" data-target="modal-sign-in">Sign In</a>
                    <a href="#" class="promoted" data-modal-external-file="modal_register.php" data-target="modal-register">Register</a>
                </div>
                <!--end secondary-nav-->
                <a href="#" class="btn btn-primary btn-small btn-rounded icon shadow add-listing" data-modal-external-file="modal_submit.php" data-target="modal-submit"><i class="fa fa-plus"></i><span>Add listing</span></a>
                <div class="nav-btn">
                    <i></i>
                    <i></i>
                    <i></i>
                </div>
                <!--end nav-btn-->
            </div>
            <!--end right-->
        </nav>
        <!--end nav-->
    </header>
    <!--end page-header-->
    <div id="page-content" ui-view>
    </div>
    <!--end page-content-->
    <footer id="page-footer">
        <div class="footer-wrapper">
            <div class="block">
                <div class="container">
                    <div class="vertical-aligned-elements">
                        <div class="element width-50">
                            <p data-toggle="modal" data-  target="#myModal">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquam at neque sit amet vestibulum. <a href="#">Terms of Use</a> and <a href="#">Privacy Policy</a>.</p>
                        </div>
                        <div class="element width-50 text-align-right">
                            <a href="#" class="circle-icon"><i class="social_twitter"></i></a>
                            <a href="#" class="circle-icon"><i class="social_facebook"></i></a>
                            <a href="#" class="circle-icon"><i class="social_youtube"></i></a>
                        </div>
                    </div>
                    <div class="background-wrapper">
                        <div class="bg-transfer opacity-50">
                            <img src="assets/img/footer-bg.png" alt="">
                        </div>
                    </div>
                    <!--end background-wrapper-->
                </div>
            </div>
            <div class="footer-navigation">
                <div class="container">
                    <div class="vertical-aligned-elements">
                        <div class="element width-50">(C) 2016 Your Company, All right reserved</div>
                        <div class="element width-50 text-align-right">
                            <a href="index.html">Home</a>
                            <a href="listing-grid-right-sidebar.html">Listings</a>
                            <a href="submit.html">Submit Item</a>
                            <a href="contact.html">Contact</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>

    <!--end page-footer-->
</div>
<!--end page-wrapper-->
<a href="#page-header" class="to-top scroll" data-show-after-scroll="600"><i class="arrow_up"></i></a>

<script type="text/javascript" src="assets/js/jquery-2.2.1.min.js"></script>
<script type="text/javascript" src="assets/js/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="assets/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="assets/js/bootstrap-select.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=AIzaSyBEDfNcQRmKQEyulDN8nGWjLYPm8s4YB58&libraries=places"></script>
<script type="text/javascript" src="assets/js/richmarker-compiled.js"></script>
<script type="text/javascript" src="assets/js/markerclusterer_packed.js"></script>
<script type="text/javascript" src="assets/js/infobox.js"></script>
<script type="text/javascript" src="assets/js/jquery.validate.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.fitvids.js"></script>
<script type="text/javascript" src="assets/js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="assets/js/icheck.min.js"></script>
<script type="text/javascript" src="assets/js/owl.carousel.min.js"></script>
<script type="text/javascript" src="assets/js/jquery.trackpad-scroll-emulator.min.js"></script>
<script type="text/javascript" src="assets/js/custom.js"></script>
<script type="text/javascript" src="assets/js/maps.js"></script>
<script src="Scripts/angular.min.js"></script>
<script src="Scripts/angular-route.min.js"></script>
<script src="Scripts/angular-ui-router.min.js"></script>
<script src="App/app.js"></script>

App.js 代码

var smh = angular.module('SMH', ['ngRoute','ui.router']);
smh.config(['$urlRouterProvider', '$stateProvider','$locationProvider' , function ($urlRouterProvider, $stateProvider,$locationProvider) {
'use strict';
$stateProvider
.state("home", {
    url: "/home",
    templateUrl: "/App/Views/main.html",
    controller: "homeCtrl"
})
.state("blog", {
    url: "/blog",
    templateUrl: "/App/Views/Blog/main.html",
    controller: "blogCtrl"
})
$urlRouterProvider.when('', '/home')
$locationProvider.hashPrefix('');
}]) 
smh.directive('datepicker', function () {
return {
    restrict: 'A',
    require: 'ngModel',
    link: function (scope, element, attrs) {
        element.datepicker({
            dateFormat: 'DD, d  MM, yy',
            onSelect: function (date) {
                scope.date = date;
                scope.$apply();
            }
        });
    }
};
}); 
smh.controller('homeCtrl', ['$scope',  function ($scope) {

}])
smh.controller('blogCtrl', ['$scope', function ($scope) {

}])

当我导航到另一个页面 jquery-2.2.1.min.js 并且 jquery-migrate-1.2.1.min.js 停止工作时,我在 jquery 的帮助下使用选择选择器。请帮我解决这个问题。

4

1 回答 1

0

试试这个cdn而不是你的localy save js

<script src="http://code.jquery.com/jquery-migrate-1.2.1.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
于 2017-03-25T10:04:47.833 回答