0
Hy everyone。 私はuu.routerでanguarjsを使ってアプリケーションを開発しています。私が直面している問題は、アプリケーションの起動時にすべてうまく動作するが、ヘッダーからページを移動するときにjqueryプラグインが動作しなくなるということです。ここで 状態変更jqueryがangularjsで作業を停止します
は私のコードであるindex.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のの助けを借りて選択ピッカーを使用していたとき、私別のページに移動する jquery-2.2.1.mi n.jsそしてjquery-migrate-1.2.1.min.jsは動作を停止します。この問題を解決する方法を教えてください。
jsファイルの保存の代わりにあなたとlocalYのこのCDNを試すには、このソリューションが動作していないこの – Gaurav