将数据绑定到 div 元素并使用 Angular.js 突出显示选定的元素

Question

我想在 div 元素中显示数据，并在页面加载时突出显示默认选中的元素，当我单击未选中的其他项目时，所选项目应更改此 .$scope 的值.selectedItem 属性。

例如我有这个数据

Item 1
Item 2

//this is the item list
 this.$scope.items = items;

//this is the selected item
this.$scope.selectedItem = selectedItem;

//html. I don't know how to design this, since I don't know how to bind the data to div element.

<div></div>

如果我有一个 div 元素，我如何绑定数据并显示它。从那里，当我选择一个项目时如何保存选定的值？

对不起，我是 Angular.js 的新手，所以我现在很困惑。

Answer 1

您可以对 div 本身进行 ng-click.. 类似这样的内容：

 <div ng-click="clicked('one')">
   Item One
  </div>

  <div ng-click="clicked('two')">
   Item Two
  </div>

在控制器中：

 $scope.clicked = function(item) {
      $scope.selectedItem = item;
    };

您可以使用ng-class 来装饰div 使其具有高光..