所以我试图复制section div（所以我可以有多个文章的多个部分）。我尝试为两个div使用相同的控制器，如下所示。所以我可以通过将其添加到main来添加该部分，但我无法编辑第二个div。有没有办法解决？
我没有使用bootstrap，而且我使用的是xeditable。
HTML：
<div id="main" ng-app="main">
<div class = "section" ng-controller="newsController">
<h2 id="section" editable-text="sections.section">{{sections.section}}</h2>
<div class = "article" ng-repeat="article in sections.articles">
<h3 id="title" editable-text="article.title"><a editable-text="article.link" href="{{article.link}}">{{article.title}}</a></h3>
<p id="publisher" editable-text="article.publisher">{{article.publisher}}</p>
<p id="orig_title" editable-text="article.orig_title">{{article.orig_title}}</p>
<p id="descr" ng-bind-html="article.description" editable-text="article.description"></p>
</div>
<div class = "section" ng-controller="newsController">
</div>
</div>
JS：
newsletter.controller('newsController',function($scope){
$scope.sections = {
section: "Faculty",
articles: [
{
title: "In __ We Trust",
link:'http://wee.com',
publisher: "Me",
orig_title:"",
description: "Description Here"
}
]
};
$scope.addItem = function(){
$scope.sections.articles.push(this.sections.articles.temp);
$scope.sections.articles.temp={};
};
)};
var newSection = '//Pretend all the tags and the attributes as above are placed here'
$("#add-section").click(function(){
var $section = $('#main').append(newSection);
});
格式化道歉。我还是新手。谢谢！
编辑：我也试图让这种动态变化，以便用户可以编辑标题和出版商等文本。我如何才能使添加的部分也可以编辑？
答案 0 :(得分：0)
尝试这种方式，而不是附加它使用angulars自然方式重复divs又名ng-repeat：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.sections = {
section: "Faculty",
articles: [{
title: "In __ We Trust",
link: 'http://wee.com',
publisher: "Me",
orig_title: "",
description: "Description Here"
}]
};
$scope.addItem = function() {
$scope.sections.articles.push(this.sections.articles.temp);
$scope.sections.articles.temp = {};
};
var newSection = '//Pretend all the tags and the attributes as above are placed here'
$("#add-section").click(function() {
var $section = $('#main').append(newSection);
});
});
</script>
<div id="main" ng-app="myApp" ng-controller="myCtrl">
<div class="section" ng-repeat="i in ['0','1']">
<h2 id="section" editable-text="sections.section">{{sections.section}}</h2>
<div class="article" ng-repeat="article in sections.articles">
<h3 id="title" editable-text="article.title"><a editable-text="article.link" href="{{article.link}}">{{article.title}}</a></h3>
<p id="publisher" editable-text="article.publisher">{{article.publisher}}</p>
<p id="orig_title" editable-text="article.orig_title">{{article.orig_title}}</p>
<p id="descr" ng-bind-html="article.description" editable-text="article.description"></p>
</div>
<div class="section" ng-controller="myCtrl"></div>
</div>
答案 1 :(得分：0)
我找到了答案！所以我将应用程序应用于html文档和控制器到主体而不是主div，并创建了一个部分数组而不是单个部分。我为div节做了一个ng-repeat。通过这样做，我添加了一个＆＃34; addsection＆＃34;函数，我创建一个要添加到数组的部分，该部分必须具有与其他部分相同的属性，包括一个空的文章数组。
HTML：
<body ng-controller="newsController">
<ul id="convenient-buttons">
<li id="add-section"><a href=# id="add-section" ng-click="addSection()">Add Section</a></li>
<li><a href=# id="copy" onclick="selectText('main')">Select All</a></li>
<li><a href=# id="export" onclick="selectText('json')" ng-mouseenter="showJson=true" ng-mouseleave="showJson=false" >Send to Server</a></li>
</ul>
<div id="main">
<div class = "section" ng-repeat="section in news.sections" >
<h2 id="section" editable-text="sections.section">{{sections.section}}</h2>
<div class = "article" ng-repeat="article in sections.articles">
<h3 id="title" editable-text="article.title"><a editable-text="article.link" href="{{article.link}}">{{article.title}}</a></h3>
<p id="publisher" editable-text="article.publisher">{{article.publisher}}</p>
<p id="orig_title" editable-text="article.orig_title">{{article.orig_title}}</p>
<p id="descr" ng-bind-html="article.description" editable-text="article.description"></p>
</div>
</div>
</body>
JS：
$scope.news = {
sections: [
{
title: "Faculty",
articles: [
{
title: "In Memoriam: Eli Pearce",
link:'http://engineering.nyu.edu/news/2015/05/29/memoriam-eli-pearce',
publisher: "NYU Newsroom",
orig_title:" ",
description: "When <strong>Professor Eli Pearce</strong> passed away on May 19, 2015, a slice of Poly history passed along with him. Pearce had been affiliated with the school, then known as the Polytechnic Institute of Brooklyn, since the mid-1950s, when he conducted his doctoral studies in chemistry here. As a student, he learned with such luminaries as Herman Frances Mark, who is often called the Father of Polymer Science, and Charles Overberger, another influential chemist who helped establish the study of polymers as a major sub-discipline."
}
]
}
]
};
$scope.addSection = function(){
$scope.news.sections.temp={
title: "Section Title",
articles:[
// {
// title:"Article Title",
// link:"Link",
// publisher: "Publisher",
// orig_title: "Original Title",
// description: "Description"
// }
]
};
$scope.news.sections.push(this.news.sections.temp);
};