7
Tôi đang học về góc cạnh và đã cố gắng tải động một đoạn tệp HTML vào ngăn nội dung của tab.Cách tải trạng thái ui-router vào nội dung của các tab ui-bootstrap
Trong this linked plunker Tôi đã tạo ra một mô-đun góc để cấu hình các bang
var app = angular.module('Plunker', ['ui.router', 'ui.bootstrap'])
app.config([
'$stateProvider',
'$urlRouterProvider',
function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state("tab1", { url: "/tab1", templateUrl: "tab1.html" })
.state("tab2", { url: "/tab2", templateUrl: "tab2.html" })
.state("tab3", { url: "/tab3", templateUrl: "tab3.html" });
$urlRouterProvider.otherwise('/');
}]);
app.controller("tabsController", function ($rootScope, $scope, $state) {
$scope.tabs = [
{ title: "My Tab 1", route: "tab1", active: true },
{ title: "My Tab 2", route: "tab2", active: false },
{ title: "My Tab 3", route: "tab3", active: false },
];
$scope.go = function (route) {
$state.go(route);
};
$scope.active = function (route) {
return $state.is(route);
};
$scope.$on("$stateChangeSuccess", function() {
$scope.tabs.forEach(function (tab) {
tab.active = $scope.active(tab.route);
});
});
});
và trong cơ thể index.html giao ui-xem một tên để liên kết nó với nhà nước/đường
<body ng-app="Plunker">
<div ng-controller="tabsController">
<uib-tabset>
<uib-tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" disable="tab.disabled">
<div ui-view="{{tab.route}}"></div>
</uib-tab>
</uib-tabset>
</div>
</body>
Mỗi tab phải có nội dung đến từ đoạn tệp html tương ứng tab1.html, tab2.html hoặc tab1.html. Nhưng tôi không thể làm cho nó hoạt động được. Bất kỳ sự giúp đỡ nào trong công việc này sẽ được đánh giá cao.
nếu bạn muốn có một tab p er tuyến đường, bạn không cần '' chỉ cần sử dụng tab css và liên kết thường xuyên –
charlietfl
@charlietfl cảm ơn tôi sẽ giữ cho rằng trong tâm trí. – Kickaha