gpt4 book ai didi

jQuery UI Tab 与 Angular JS 绑定(bind)

转载 作者:行者123 更新时间:2023-12-01 05:44:19 25 4
gpt4 key购买 nike

我尝试了这个问题的答案。 Jquery UI tab not working in AngularJS

但是我用我的应用程序尝试过,div 会重复出现。

这是我的代码,

HTML

<html data-ng-app="recipes">
<!--- links and sources -->
<body data-ng-controller="recipe-controller">
<div id="tabs" ng-tabs>
<ul>
<li ng-repeat="page in jPages">
<a class="pageName" href="#{{page.id}}">{{page.name}}</a>
</li>
</ul>
<div id="{{page.id}}" ng-repeat="page in jPages">
<p>{{page.id}}</p>
</div>
</div>
</body>
</html>

JS

var app = angular.module('recipes', ['ui.bootstrap', 'ngSanitize', 'timer', 'emoji', 'ngGrid', 'ngCsv', 'xeditable'])

app.directive('ngTabs', function() {
return function(scope, elm) {
setTimeout(function() {
elm.tabs();
},0);
};
});

app.controller('recipe-controller', function ($scope, $http, $filter, $modal, $timeout, recipesFactory, config, ShoppingListsFactory, $rootScope) {
var pageArray = [
{
"id": "tab1",
"name": "tab1"},
{
"id": "tab2",
"name": "tab2"},
{
"id": "tab3",
"name": "tab3"},
{
"id": "tab4",
"name": "tab4"},
{
"id": "tab5",
"name": "tab5"},
{
"id": "tab6",
"name": "tab6"},
{
"id": "tab7",
"name": "tab7"},
{
"id": "tab8",
"name": "tab8"}
];
$scope.jPages = pageArray;

});

这是我实际输出的屏幕截图。

enter image description here

我正在使用 jQuery UI 选项卡,因为我需要它与 IE8 一起使用,Angular Bootstrap 中的选项卡集在 IE8 中无法正常工作。

最佳答案

尝试添加这段代码,看看是否有效。

function recipes($scope) {
$scope.pages = pageArray;
}

关于jQuery UI Tab 与 Angular JS 绑定(bind),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28337752/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com