这里用Angularjs如何关联?

Question

点击上面的选项，下拉框自动跳转到一样的，同理，下拉框选中，上面的也要变成一样的，请问如何实现啊？

Answer 1

<select ng-model="data.val">
<option value='1'>行业信用</option>
<option value='2'>金融工程</option>
</select>

$scope.data ={
    val:1
} 

上面对应的添加点击事件改变data.val的值就好。

Answer 2

给你一条思路 利用两组数组 下面的手动改变了, 上面的通过监听 把下面的数组的索引(或其他) 赋值给上面的数组 相应的改变样式

Answer 3

我看题主说用angularjs实现，那就是要把他们绑定在一个模型上

直接上代码，亲测可用

<style>
    .active{
        background-color:light-blue;
    }
</style>

<button ng-class="{active:(activeValue==1)}" ng-click="activeValue='1'">全部</button>
<button ng-class="{active:(activeValue==2)}" ng-click="activeValue='2'">行业</button>
<button ng-class="{active:(activeValue==3)}" ng-click="activeValue='3'">其他</button>
<select ng-model="activeValue">
  <option value=1>全部</option>
  <option value=2>行业</option>
  <option value=3>其他</option>
</select>

Answer 4

对于数据共享的问题给具体情况具体分析，你并没有明确的说明你的布局是怎么安排的，我尽可能把我能想到的所有情况分享给你

• 对于【类型分类】选项和【一级行业名称】下拉框属于同一个组件的情况，只需要让它们的视图模型绑定到同一个数据模型上即可

• 对于【类型分类】选项和【一级行业名称】为两个不同的组件，但是它们有共同的父组件，则将视图模型提升到父组件中，之后通过属性传值的方式传递给子组件，绑定视图模型的逻辑和上面一样。

• 对于【类型分类】选项和【一级行业名称】为两个不同的组件，且它们也没有共同的父组件，则考虑实现一个service实例，维护数据模型，之后通过在两个组件中注入该service的方式来维护数据模型，绑定视图模型的逻辑同上。