2015-03-31 3 views
0

Я новичок в ui-router и борется с дочерней страницей.ui-router и child page

У меня есть один ui-view, который обрабатывает все изменения страницы. У меня есть одна страница под названием счет, которая принимает параметр : accountNumber. Состояние устанавливается следующим образом:

$stateProvider.state('account', { 
    url: "/account/:accountNumber", 
    templateUrl: 'app/account/account.tpl.html', 
    controller: 'AccountController', 
    controllerAs: 'controller', 
    data: { 
     requireLogin: true 
    } 
}); 

Теперь я хочу, чтобы создать страницу, которая сидит под URL /счет /: ACCOUNTNUMBER/складе, но я не могу заставить его работать правильно. Я добавил состояние так:

$stateProvider.state('account.stock', { 
    url: "/stock", 
    templateUrl: 'app/account/stock/stock.tpl.html', 
    controller: 'StockController', 
    controllerAs: 'controller', 
    data: { 
     requireLogin: true 
    } 
}); 

и изменил мою ссылку на это:

<a class="tile box-shadow" ui-sref="account.stock" tile coloured-tile> 
    <i class="fa fa-spinner"></i> 
    <span class="title">Stock enquiry</span> 
</a> 

Но когда я нажимаю кнопку ничего не нагрузки, несмотря на то, если я наведите курсор мыши на ссылку он показывает правильно URL.

поэтому я попытался это:

$stateProvider.state('stock', { 
    url: "/account/:accountNumber/stock", 
    templateUrl: 'app/account/stock/stock.tpl.html', 
    controller: 'StockController', 
    controllerAs: 'controller', 
    data: { 
     requireLogin: true 
    } 
}); 

, но когда я нажимаю мою ссылку в адресной строке выглядит следующим образом:

/счета // фондовый

Это работа, отмечающая, что моя ссылка выглядит так:

<a class="tile box-shadow" ui-sref="stock" tile coloured-tile> 
    <i class="fa fa-spinner"></i> 
    <span class="title">Stock enquiry</span> 
</a> 

Кто-нибудь знает о решении?

+0

это должно быть 'ui-sref =" stock ({'accountNumber': 1})" ' –

+0

У вас есть ui-view внутри приложения/account/account.tpl.html, чтобы детские представления могли показать себя? – bahadir

ответ

1
$stateProvider.state('account', { 
    url: "/account/:accountNumber", 
    templateUrl: 'app/account/account.tpl.html', 
    controller: 'AccountController', 
    controllerAs: 'controller', 
    data: { 
     requireLogin: true 
    } 
}); 

В вашем вышеуказанном состоянии вы имеете accontNumber, как Url parameter.So в этом состоянии ребенка вам необходимо этот параметр следует упомянуть.

Таким образом, вам необходимо передать номер счета, когда вам необходимо загрузить состояние account.stock.

Ваш url должен быть /account/101/stock. Скажем, здесь 101 номер вашего аккаунта.

Итак, нажмите кнопку, чтобы перейти к этому параметру в json. как

ui-sref="account.stock({accountNumber: 101})" 

Здесь в шаблоне HTML

<a class="tile box-shadow" ui-sref="account.stock({accountNumber: YOUR_SCOPE_VARIABLE_OR_STATIC_ACC_NO})" tile coloured-tile> 
    <i class="fa fa-spinner"></i> 
    <span class="title">Stock enquiry</span> 
</a> 
0

Как я сказал в комментарии, вы непосредственно доступ состояние ребенка, но родительское состояние имеет accountNumber параметр, вам нужно передать его в государственный вызов, чтобы сформировать правильно url как ui-sref="account.stock({'accountNumber': 1})"

Markup

<a class="tile box-shadow" ui-sref="account.stock({'accountNumber': 1})" tile coloured-tile> 
    <i class="fa fa-spinner"></i> 
    <span class="title">Stock enquiry</span> 
</a> 
Смежные вопросы