Angular ui-router:链接不可点击

2024-05-07

我尝试运行 angular-ui-router 来处理我的视图,但我遇到了问题。 以下视图的两个链接不可点击。 带有链接标签的角度更改变量,但我无法单击。

我有这样的观点:

<!DOCTYPE html>
<html ng-app="MyApp">
    <head>
            <meta charset="utf-8">
    </head>
    <body>
        <h1>App</h1>
        <nav>
            <a ui-shref="app">{{link.home}}</a>
            <a ui-shref="app.front.signin">{{link.signin}}</a>
        </nav>
         <div ui-view="content">
        </div>
    </body>
</html>    

我用这个代码。它不返回错误 。所有模块(包括 localStorage ...),但链接不可点击。

/**
 * Declaration of MyAppControllers module
 */
 MyAppControllers = angular.module('MyAppControllers',[]);
/**
 * Declaration of MyApp Application
 */
MyApp = angular.module('MyApp', ['MyAppControllers','LocalStorageModule','ui.router']);  


MyApp.config(['$stateProvider', '$urlRouterProvider',
function ($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise("/");
    //
    // Now set up the states
    $stateProvider
            .state('app', {
                url: "/",
                views: {
                    "content": {templateUrl: "views/front/home-1.0.html"}
                }
            }) 
            .state('app.front.signin', {
                url: "/signin",
                views: {
                    "content": {templateUrl: "views/front/home-1.0.html", controller: "signinCtrl"}
                }
            });

    }
]);

有人能帮我吗 ?


你搞乱了它应该是的类型ui-sref代替ui-shref

<body>
    <h1>App</h1>
    <nav>
        <a ui-sref="app">{{link.home}}</a>
        <a ui-sref="app.front.signin">{{link.signin}}</a>
    </nav>
     <div ui-view="content">
    </div>
</body>

你的第二个链接应该是app.signin代替app.front.signin因为你没有父路由front

.state('app.signin', {
    url: "/signin",
    views: {
        "content": {
            templateUrl: "views/front/home-1.0.html", 
            controller: "signinCtrl"
        }
    }
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular ui-router:链接不可点击 的相关文章

  • 我可以动态创建/销毁 Vue 组件吗?

    因此 我正在创建一个相当复杂的 Vue 应用程序 它从后端 API 获取数据并将其显示在前端 具体取决于用户选择的过滤器 它的默认设置是立即显示所有内容 然后一旦用户选择过滤器 它就会拉出不具有这些属性的 卡片 组件 直到今天 一切都很顺利
  • Javascript 在另一个函数中检测“Shift”键按下

    我正在从 Flash 影片 使用外部接口 调用我的 html 页面中的 Javascript 函数 并且我想知道调用该函数时用户是否按下了 Shift 键 例如 如果我通过鼠标单击调用该函数 这似乎很简单 因为我可以传递事件并检查 if e
  • Sequelize - 使用 es6 和模块运行迁移

    我不确定我是否做错了什么或者什么 我觉得我正在运行一个现代的 相当常见的堆栈 但我无法让新的 Sequelize v6 与我的设置完美配合 我在 Node v14 17 Sequelize v6 6 2 上 在我的 package json
  • Angularjs 完整日历不显示事件

    我正在用那个https github com angular ui ui calendar https github com angular ui ui calendar在 Angularjs 中使用 FullCalendar 它显示日历并
  • html canvas动画卡顿

    谁能解释为什么提供的画布动画断断续续 我创建了一个测试存根来演示该问题 我在桌面上的 FF Chrome IE 以及 Android 上的 FF 和 Chrome 中看到了卡顿现象 口吃是由于垃圾收集造成的吗 似乎 raf 在每次调用时都会
  • 为什么我们使用 SpreadsheetApp.flush()?

    我的理解是 flush https developers google com apps script reference spreadsheet spreadsheet app flush有助于在功能发生时执行这些功能 而无需将它们捆绑在
  • JavaScript:常量属性

    在javascript中 我可以将对象的属性声明为常量吗 这是一个示例对象 var XU Cc Components classes or function aXU this Cc Components classes var XU new
  • put方法中的Angularjs文件上传不起作用

    我有一个简单的待办事项应用程序 我试图在其中上传照片和单个待办事项 现在我已经创建了这个工厂函数来负责待办事项的创建 todosFactory insertTodo function todo return http post baseUr
  • 为什么 Array.prototype.filter() 在 Magnolia JavaScript 模型中抛出错误?

    我正在尝试过滤 FreeMarker 列表Magnolia JavaScript 模型 https documentation magnolia cms com display DOCS61 How to work with JavaScr
  • JavaScript Promise 不执行 .then()

    我在 JavaScript 中的 Promise 方面遇到了一些问题 我想做的是获得一个地址列表 然后对于每个地址 我需要调用地理编码 API 来获取 lat lng 然后我将继续将标记与热图一起绘制 这是我的代码 let promiseK
  • 不使用控件时,视频元素在 Chrome 中消失

    So I think这是一个浏览器错误 它出现在一个更复杂的设计 网站中 但我已经进行了很好的尝试 简化了我的代码和设计等 并发现了以下内容 嵌入时
  • Javascript onload 不起作用[关闭]

    这个问题不太可能对任何未来的访客有帮助 它只与一个较小的地理区域 一个特定的时间点或一个非常狭窄的情况相关 通常不适用于全世界的互联网受众 为了帮助使这个问题更广泛地适用 访问帮助中心 help reopen questions 我正在使用
  • Django 将 JSON 数据传递给静态 getJSON/Javascript

    我正在尝试从 models py 中获取数据并将其序列化为views py 中的 JSON 对象 模型 py class Platform models Model platformtype models CharField max len
  • 弹出窗口的动态高度取决于内容,可能吗?

    是否有可能获得一个宽度始终为 400px 的弹出窗口 但根据弹出窗口中的内容动态高度 我已经看到了这个 但不知道如何将其应用到弹出窗口 调整 iframe 的宽度高度以适应其中的内容 https stackoverflow com ques
  • Javascript 中 if 语句中的假值?

    过去两周 我在学校研究 JavaScript 的事情已经有一段时间了 而且我一直在做我的作业 在 Douglas Crockford 所著的 JavaScript The Good Parts 一书中 作者在第 11 页上列出了 if 语句
  • 检测浏览器选项卡是否具有焦点

    是否有可靠的跨浏览器方法来检测选项卡是否具有焦点 场景是 我们有一个定期轮询股票价格的应用程序 如果页面没有焦点 我们可以停止轮询并为每个人节省流量噪音 特别是当人们喜欢打开具有不同投资组合的多个选项卡时 Is window onblur
  • 如何:带有 onclick 的 div 位于另一个带有 onclick 的 div 中

    只是一个简单的问题 我遇到了 div 与 onclick javascript 之间的问题 当我点击内部 div 时 它应该只触发它的 onclick javascript 但外部 div 的 javascript 也会被触发 用户如何点击
  • 在方法内部执行方法

    我目前正在 FreeCodeCamp 中进行 JavaScript 练习 我的代码应该使用的测试用例之一是函数调用 如下所示 addTogether 2 3 这是我得到的基本功能 function addTogether return 当我
  • 搜索多维数组 JavaScript

    我有一个如下所示的数组 selected products 0 r1 7up 61 Albertsons selected products 1 r3 Arrowhead 78 Arrowhead selected products 2 r
  • p5 向量减法“sub”返回错误

    我一直在尝试将 p5 草图上传到 React 构建中 使用react p5 wrapper 我能够成功在屏幕上渲染画布 但是 某些矢量函数会导致错误 var distance this position dist ball position

随机推荐