【发布时间】:2017-03-20 16:30:42
【问题描述】:
我正在学习 Angular,但我坚持使用 ui-router。
这是代码。我正在使用 PUG 和 Livescript,我怀疑我是否因为这两个而遇到问题。
我的代码类似于 stackoverflow 中的一些答案,但我无法使其工作。 create.pug 未显示。
main.pug 是 index.pug 的子
create.pug 是 main.pug 的子节点
create.pug -> main.pug -> index.pug
版本:
angular -> 1.6.3
angular-ui-router -> 0.4.2
index.pug
html(ng-app="app.main")
head ...
body
div(ui-view)
main.pug
md-subheader
h1 To Do
md-divider
section(ui-view)
创建.pug
md-input-container
label Title
input(type="test" ng-model="app.new_task" ng-keypress="createTask($event)")
main.ls
MainController = ($scope) !->
angular
.module 'app.main'
.controller 'MainController', MainController
创建.ls
TaskCreateController = ($scope) !->
app = @
app.taskList = []
$scope.createTask = ($event) !->
if $event.keyCode !== 13 || !app.new_task
return
app.taskList.push app.new_task
app.new_task = ''
angular
.module 'app.main'
.controller 'TaskCreateController', TaskCreateController
路由器.ls
routeHelper = ($locationProvider, $stateProvider, $urlRouterProvider) !->
this.$get = ($state) ->
'configureStates': (states) !->
Object
.entries states
.forEach ([name, config]) !->
$stateProvider.state name, config
$locationProvider.html5Mode false
$urlRouterProvider.otherwise '/'
angular
.module 'app.main'
.provider 'routeHelper', routeHelper
routes.ls
setupRoutes = (routeHelper) !->
routeHelper.configureStates do
'home':
'url': '/'
'templateUrl': 'modules/main/main.html'
'controller': 'MainController'
'controllerAs': 'app'
'home.create':
'url': '/create'
'templateUrl': 'modules/task/create/create.html'
'controller': 'TaskCreateController'
'controllerAs': 'app'
angular
.module 'app.main'
.run setupRoutes
【问题讨论】:
-
什么不工作?
-
create.pug 未显示
-
好的,那么 IMO 有必要看看你是如何进行模板继承的,以了解全貌。
-
这些是我仅有的文件(目前不包括供应商文件)我不确定模板继承到底是什么,我是新手。
-
当你说“main.pug 是 index.pug 的孩子”时,你是怎么做到的,你是用 Pug includes 还是 content bloks ?
标签: angularjs angular-ui-router pug livescript nested-views