Your question lacks some necessary contextual information, so I can only rely on speculation or guessing to complete it
The routing system of any SPA framework is the same: each route corresponds to the status of the application, and changes in the application status are reflected in changes in URLs; conversely, changes in URLs will cause the routing system to dynamically refresh the application The status of the program.
In your example, there is only one constant entrance to the routing ui-view='content',但却要不同的视图(c.html 和 d.html)动态的进入其中,这就意味着 c.html 和 d.html It needs to correspond to the different states of the application, so that the routing system can dynamically update it accordingly.
Suppose your example looks like this:
when /posts/show/c 的时候,ui-view='content' 显示 c.html
when /posts/show/d 的时候,ui-view='content' 显示 d.html
So we can correspond to ui-router:
state 是 posts.show
Dynamic fragments, that is, the variable parts of URLs, correspond to state 里的 url,我把它命名为 :name
The only question left is: when :name 变化的时候,如何更新 templateUrl?
As mentioned before, changes in URLs will cause the routing system to update the application's state, and these changes are saved in the routing system $params 对象中,我们可以用该对象提取变化的部分并生成正确的 templateUrl. Here I write a helper function to do this:
ui-router This module templateUrl not only receives strings, but can also receive function return values. So you can get:
When /posts/show/c, /posts/show/c 的时候,templateUrl 是 templates/posts/c.html is templates/posts/c.html
When /posts/show/d, /posts/show/d 的时候,templateUrl 是 templates/posts/d.html is templates/posts/d.html
Correspondingly, after your index 里的导航链接就要负责切换 /posts/show/:name changes, the link on how to generate the corresponding dynamic fragment is in the ui-router documentation, go find it yourself.
Your question lacks some necessary contextual information, so I can only rely on speculation or guessing to complete it
The routing system of any SPA framework is the same: each route corresponds to the status of the application, and changes in the application status are reflected in changes in URLs; conversely, changes in URLs will cause the routing system to dynamically refresh the application The status of the program.
In your example, there is only one constant entrance to the routing
ui-view='content'
,但却要不同的视图(c.html
和d.html
)动态的进入其中,这就意味着c.html
和d.html
It needs to correspond to the different states of the application, so that the routing system can dynamically update it accordingly.Suppose your example looks like this:
when
/posts/show/c
的时候,ui-view='content'
显示c.html
when
/posts/show/d
的时候,ui-view='content'
显示d.html
So we can correspond to ui-router:
state
是posts.show
Dynamic fragments, that is, the variable parts of URLs, correspond to
state
里的url
,我把它命名为:name
view
的入口是content@posts.show
This is enough to write most of the code:
The only question left is: when
:name
变化的时候,如何更新templateUrl
?As mentioned before, changes in URLs will cause the routing system to update the application's state, and these changes are saved in the routing system
$params
对象中,我们可以用该对象提取变化的部分并生成正确的templateUrl
. Here I write a helper function to do this:ui-router This module
templateUrl
not only receives strings, but can also receive function return values. So you can get:When
/posts/show/c
,/posts/show/c
的时候,templateUrl
是templates/posts/c.html
istemplates/posts/c.html
When
/posts/show/d
,/posts/show/d
的时候,templateUrl
是templates/posts/d.html
istemplates/posts/d.html
Correspondingly, after your
index
里的导航链接就要负责切换/posts/show/:name
changes, the link on how to generate the corresponding dynamic fragment is in the ui-router documentation, go find it yourself.I think the people above are making the game too complicated. Wouldn’t it be nice to just watch a ui-view tutorial
https://scotch.io/tutorials/a...