我过去两天一直在努力，并没有弄清楚我做错了哪里。
尝试通过Angular从json源重复元素并成功重复内容。 但之后需要应用Mixitup插件。
$scope.url = 'views/portfolio-all.php';
$http.post($scope.url).
success(function(data, status) {
if ( angular.isArray(data) ) {
$scope.reports = data;
}
else {
$scope.reports = [data];
}
})
.
error(function(data, status) {
$scope.data = data || "Request failed";
$scope.status = status;
console.log(status);
});
$('#portfolioList').mixItUp({
callbacks: {
onMixLoad: function(){
console.log('MixItUp ready!');
},
onMixFail: function(){
console.log("No elements found matching");
}
},
load: {
filter: '.website'
},
debug: {
enable: true,
mode: 'verbose'
}
});
这是我的HTML，你看错了吗？
<div id="portfolio-thumbs">
<div class="container">
<div class="menubar controls">
<ul>
<li class="filter hide" data-filter="all">Show All</li>
<li class="filter active" data-filter=".website">Websites</li>
<li class="filter" data-filter=".mobile">Mobiles</li>
<li class="filter" data-filter=".brand">Brand & Identity</li>
<li class="filter" data-filter=".ecommerce">E-Commerce</li>
<li class="filter" data-filter=".print">Print & Graphics</li>
<li class="filter" data-filter=".marketing">Marketing</li>
</ul>
<div class="clearfix"></div>
</div>
</div>
<div class="controls hide">
<ul>
<li class="sort" data-sort="data-cat" data-order="desc">Descending</li>
<li class="sort" data-sort="data-cat" data-order="asc">Ascending</li>
<li class="sort active" data-sort="default" data-order="desc">Default</li>
</ul>
</div>
<div class="clearfix"></div>
<div class="container">
<div class="row" id="portfolioList" ng:repeat="report in reports">
<div class="mix {{reportItem.categories}}" ng:repeat="reportItem in report">
<a ng-href="#portfolio/{{reportItem.title_alias}}">
<img ng-src="{{reportItem.img}}"/>
<div><span>{{reportItem.title}}</span></div>
</a>
</div>
<div class="gap"></div>
<div class="gap"></div>
</div>
</div>
</div>
答案 0 :(得分：1)
不确定这是否是你的问题，但是你想在请求完成后激活mixItUp，你需要从成功回调中调用它，因为调用是异步的。
$scope.url = 'views/portfolio-all.php';
$http.post($scope.url).
success(function(data, status) {
if ( angular.isArray(data) ) {
$scope.reports = data;
}
else {
$scope.reports = [data];
}
//call mixItUpHere:
$('#portfolioList').mixItUp({
callbacks: {
onMixLoad: function(){
console.log('MixItUp ready!');
},
onMixFail: function(){
console.log("No elements found matching");
}
},
load: {
filter: '.website'
},
debug: {
enable: true,
mode: 'verbose'
}
})
error(function(data, status) {
$scope.data = data || "Request failed";
$scope.status = status;
console.log(status);
});
});
答案 1 :(得分：1)
这里有两个潜在的问题。
第一个是$http是异步的，因此您可能需要在$ http（）。success callback中运行任何类型的初始化。
$http.get('myurl.php').success(function(data){
//do stuff here that deals with your returned data
});
第二个需要更多解释：
在角度上下文之外修改DOM通常不是您想要做的事情（因为角度运行时的工作方式）。
仅仅因为你为$ scope变量分配一个数组并不意味着已经创建了DOM节点（通过ng-repeat等）。通常情况下，你必须强迫角度来刷新自己＆＃34;并运行由某些方法触发的摘要循环。典型的是$ scope。$ apply，你可以在这里找到关于这类事情的信息：
http://docs.angularjs.org/api/ng/type/ $ rootScope.Scope
我自己通常使用$ timeout服务，它也在内部处理这个问题。所以我只想用你的jQuery插件代码包装：
$timeout(function() {
// load jquery plugin here
// at 500ms so you can tell for sure if this is the problem or not
// normally you wouldn't want to wait a half second to load something
}, 500);
声明： 使用timeout（）或sleep（）机制修复非确定性代码在大多数情况下是一个非常糟糕的主意，除非你真的需要一起破解。
我也会尝试$scope.$apply()或将$timeout时间移动到1毫秒等。
答案 2 :(得分：0)
谢谢你们，
当我把mixitup置于成功状态时，它甚至没有从那里调用它，但当我把它放在渲染ng-repeat的实际html中时，它的调用它给了我以下调试消息。