使用angularjs ng Show/ng hide显示和隐藏不同的内容

我是angularjs的新手，正在努力制定一些逻辑，根据不同的点击使用ng show和ng hide来显示和隐藏不同的div。

柱塞

视图1:

<div ng-hide="section1">
  <select>
    <option>Select List 1</option>
    <option>Select List 2</option>
  </select>
</div>
<div ng-hide="section1">
  <ul>
    <li ng-repeat="name in names">{{name.item}}</li>
  </ul>
  <button type="button" ng-click="section1=!section1">Edit</button>
</div>

最初，它显示一个下拉菜单，一些列表项目和编辑按钮

点击编辑按钮所有东西都隐藏并显示View 2

视图2:

<div ng-show="section1">
       <button type="button" ng-click="section2=!section2">+ Create New Item</button>
    </div>
    <div ng-show="section1">
      <ul>
        <li ng-repeat="name in names">
          <input type="text" ng-model="name.item">
        </li>
      </ul>
      <button type="button" ng-click="section1=!section1">Save</button>
    </div>

在视图2中，有一个按钮"创建新项目"、与视图1的列表项目值相同的输入字段列表和一个保存按钮。该视图2基本上是视图1的编辑模式。

Upto现在运行良好。

问题：如果我单击"+创建新项目"，"视图2"应隐藏，"视图3"应打开。

视图3包含一些空白的输入列表和"保存按钮"。点击"保存按钮"隐藏"视图3"并再次打开"视图1"。

查看3

<div ng-show="section2">
      <ul>
        <li ng-repeat="name in names">
          <input type="text">
        </li>
      </ul>
      <button type="button" ng-click="section2=!section2">Save New List</button>
    </div>

我正在努力管理3个不同的视图基于不同的按钮点击ng显示和隐藏。点击"+创建新按钮"时，它没有正确显示和隐藏。

这有可能使它与ng-show&只藏起来？有更好的处理方法吗？

任何帮助都将不胜感激。