Question

本周我用Angular Material开始了一个概念验证，在这个POC中，我有一个显示嵌套数据的表：

.model small
.data
st1 db "A",'$' 
.code
main proc
    mov AX,@data
    mov DS, AX

    mov AX, offset st1
    push AX

    call putch

    putch proc near
        mov BP,SP 
        mov DX,[BP+2]
        mov AH,2
        INT 21H
        ret
    putch endp 

    mov AH,4CH
    INT 21H

end main

来自Controller的

片段：

<table>
    <thead>
        <tr>
            <th colspan="2">Employee Name</th>
            <th>Ovr</th>
            <th>&nbsp;</th>
        <tr>
    <thead>
    <tbody ng-repeat="employee in evaluation.employees" >
        <tr ng-class-odd="'odd-row'">
            <td class="photo"><img src="{{employee.photo}}" /></td>
            <td class="name"><span class="firstname">{{employee.firstName}}</span><br/><span class="lastname">{{employee.lastName}}</span></td>                
            <td class="column-align-center"><span>{{employee.grade}}</span></td>
            <td class="column-align-center"><md-button ng-click="toggleAptitudes(employee.id)" class="md-raised md-primary custom-button">+</md-button></td>
        </tr>
        <tr ng-repeat="skill in employee.skills" ng-show="employee.displayAptitudes">
            <td colspan="4" style="padding: 0px 20px 0px 20px;">
                <md-slider-container>
                    <span>{{skill.name}}</span>
                    <md-slider class="md-primary" flex min="0" max="100" ng-model="skill.value" ng-change="calculateAptitudesGrade(employee.id)" aria-label="skill.name" id="red-slider">
                    </md-slider>
                    <md-input-container>
                        <input flex type="number" ng-model="skill.value" aria-label="skill.title" aria-controls="red-slider">
                    </md-input-container>
                </md-slider-container>
            </td>
        </tr>
    </tbody>
</table>

我修改的第一行工作正常。我点击切换按钮，它会显示滑块技能列表，我移动滑块，整体计算效果非常好。

问题：每当我选择其他员工时，滑块都会使用之前的值进行直观设置。如何将每个员工的滑块设置为0？

Answer 1

对于按钮上的ng-click，请将其从toggleAptitudes(employee.id)更改为employee.displayAptitudes = !employee.displayAptitudes

Answer 2

好的好的，我发现了问题!!

就像我说的那样，这是一个POC，我做得很快。问题来自我已经定义的«Aptitudes»数组......并重新用于数组中定义的每个员工......

self.aptitudes= [
    { id: 1, title: 'Aptitude 1', value: 0 },
    { id: 2, title: 'Aptitude 2', value: 0 },
    { id: 3, title: 'Aptitude 3', value: 0 }   
];

// Mock data...
self.employees = [
    { id: 1, firstName: 'FirstName1', lastName: 'LastName1', photo: 'img/photo1.png', grade: 0, aptitudes: self.aptitudes, displayAptitudes: false },
    { id: 2, firstName: 'FirstName2', lastName: 'LastName2', photo: 'img/photo2.png', grade: 0, aptitudes: self.aptitudes, displayAptitudes: false }
];

我没有声明一个数组，而是创建了一个返回数组的函数：

function getAptitudes() {
    return [
        { id: 1, title: 'Aptitude 1', value: 0 },
        { id: 2, title: 'Aptitude 2', value: 0 },
        { id: 3, title: 'Aptitude 3', value: 0 }   
    ];
}

如何使用嵌套数据重新初始化Angular模型？

2 个答案: