gpt4 book ai didi

javascript - Angularjs - javascript 未加载到部分 View 内

转载 作者:行者123 更新时间:2023-12-02 16:25:57 25 4
gpt4 key购买 nike

我尝试使用指令加载脚本,但它不起作用,我有一个应用程序,它应该在部分 View 中显示图表(仪表),尝试将脚本粘贴到部分 View 中,但没有用,即使指令也没有不工作。但是,如果页面正常加载,则其工作正常,当其用作部分时,其不显示任何图表(与脚本相关的内容)

有什么简单的例子可以在 angularjs 的部分 View 中加载脚本吗?

index.html

<!DOCTYPE html>
<html>
<head>
<!-- CSS (load bootstrap) -->
<link rel="stylesheet" href="bootstrap.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<!-- JS (load angular, ui-router, and our custom js file) -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.min.js"></script>

<script src="angular-ui-router.min.js"></script>

<script src="app.js"></script>
</head>

<body ng-app="routerApp">

<!-- NAVIGATION -->
<nav class="navbar navbar-inverse" role="navigation">

<ul class="nav navbar-nav">
<li><a ui-sref="home">Customer Details</a></li>
<li><a ui-sref="about">Job Details</a></li>
</ul>
</nav>

<!-- MAIN CONTENT -->

<div class="container">
<div ui-view></div>
</div>

</body>
</html>

app.js

var routerApp = angular.module('routerApp', ['ui.router']);

routerApp.config(function($stateProvider, $urlRouterProvider) {

$urlRouterProvider.otherwise('/home');

$stateProvider

// HOME STATES AND NESTED VIEWS

.state('home', {
url: '/home',
templateUrl: 'partial-home.html'
})


.state('home.list', {
url: '/list',
templateUrl: 'partial-home-list.html',
controller: function($scope) {
$scope.dogs = ['Bernese', 'Husky', 'Goldendoodle'];
}
})


//JOB Section Navigations

.state('job', {
url: '/jobdetails',
templateUrl: 'jobdetails.html'

})


// ABOUT PAGE AND MULTIPLE NAMED VIEWS
.state('about', {
url: '/about',
views: {
'': { templateUrl: 'partial-about.html' },
'columnOne@about': { template: 'Look I am a column!' },
'columnTwo@about': {
templateUrl: 'table-data.html',
controller: 'scotchController'
}
}

});

});

routerApp.controller('scotchController', function($scope) {

$scope.message = 'test';

$scope.scotches = [
{
name: 'Macallan 12',
price: 50
},
{
name: 'Chivas Regal Royal Salute',
price: 10000
},
{
name: 'Glenfiddich 1937',
price: 20000
}
];

});

routerApp.directive('jsSidebar' , function() {
return {
link: function(scope, element, attrs) {

alert('testing');

}
}
});

partial-home.html

<div > Home partial page </div>
<a ui-sref="job"> Click to Display Chart </a>
<div ui-view></div>

工作详情.html

<script >
//Chart library is mentioned which is over 2000lines
</script>
<!-- here chart supposed to be rendered-->
<div id="id_of_chart"></div>
<div jsSidebar >Testing purpose</div>

最佳答案

ng-view 不会加载模板内的脚本。
检查这个.. https://stackoverflow.com/a/18220411/4578788了解更多详情。

关于javascript - Angularjs - javascript 未加载到部分 View 内,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28694371/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com