gpt4 book ai didi

javascript - ui-router 不呈现模板 MVC5

转载 作者:可可西里 更新时间:2023-11-01 14:44:21 25 4
gpt4 key购买 nike

我无法让最基本的 Angular UI-Router 设置正常工作。

我现在只想呈现一个硬编码模板,然后诊断是否加载 .html 文件。我正在为我的项目使用 MVC5 我将分解下面的文件,但我会跳过一些明显的东西......如果我需要包含它,我会。 (很明显,我的意思是我放置脚本/css、head 标签、html 标签等所有内容的位置。)

Index.cshtml

<div ui-view="test"></div>

_Layout.cshtml

@{
Layout = null;
}

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title></title>
@Styles.Render("~/Content/css")
</head>
<body ng-app="myApp">
<script src="~/Scripts/jquery-2.1.4.min.js"></script>
<div class="container">
@RenderBody()
</div>
@Scripts.Render("~/Scripts/Apps")
</body>
</html>

myApp.js

(function () {
"use strict";
var myApp = angular.module('myApp', ["ui.router"]);
myApp.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('home', {
url: '/',
views: {
"test@home": {
template:"<h1>Test</h1>"
}
}
})

$urlRouterProvider.otherwise("/")
}]);
})();

然而,当我导航到我的网站时...它只是一个空白的白页?没有控制台错误或任何...

我尝试添加:

<a ui-sref="test"></a>

这只是引发了一个错误:

Error: Could not resolve 'test' from state ''

所以我迷路了......任何建议都会很棒!

最佳答案

首先将“test@home” View 更改为“test-home”。

然后更改 View 的名称,因为它在脚本中指定:

来自:

<div ui-view="test"></div>

收件人:

<div ui-view="test-home"></div>

正确的代码:

     var myApp = angular.module('myApp', ["ui.router"]);
myApp.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {

$urlRouterProvider.otherwise("/home");

$stateProvider
.state('home', {
url: '/home',
views: {
"test-home": {
template: "<h1>Home</h1>"
}
}
}).state('test', {
url: '/test',
views: {
"test-home": {
template: "<h1>teste</h1>"
}
}
});

}]);

关于javascript - ui-router 不呈现模板 MVC5,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32675270/

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