Przekazywanie wartości dynamicznej z pojedynczym cudzysłowem jako wyrażeniem wartości true powoduje niepowodzenie.

Question

Mam moje wejście checkbox, które ustawia dynamicznie wartość "true" na podstawie zmiennej trueVal, która jest łańcuchem.

<input ng-model="foo" ng-true-value="'{{trueVal}}'"> 

Na przykład dla trueVal = "something", foo === "something" gdy pole wyboru jest zaznaczone.

Działa to z wyjątkiem przypadku, gdy trueVal jest równy łańcuchowi z pojedynczym cudzysłowem: Customer didn't understand. W tym przypadku nie jest to błąd:

Error: [$parse:lexerr] Lexer Error: Unterminated quote at columns 27-28 ['] in expression ['Customer didn't understand'].

nie mogę zerwać apostrofów ponieważ ciąg powinien być ustawiony jak jest do foo.

szerszym kontekście:

tworzę grupę wyboru w oparciu o listę options że dostanę z back-end:

<div ng-repeat="(key,option) in options"> 
    <input type="checkbox" 
     ng-model="foo[key]" 
     ng-true-value="'{{option.trueVal}}'" 
     ng-false-value="null"> 
</div> 

więc, biorąc pod uwagę:

options = { 
      0: {trueVal: "Customer was late"}, 
      1: {trueVal: "Customer didn't understand"} 
      }; 

Spodziewam się zobaczyć:

foo = { 
    1: "Customer didn't understand" 
}; 

jeśli drugie pole jest zaznaczone.

Answer 1

Wersja krótka, ng-true-val spodziewa się stała i jest przekazywane następujące wyrażenie jako parametr: 'Customer didn't understand' do oceny, która jest zniekształcone z powodu un zakończony pojedynczy cudzysłów.

Prosta (ale nieco brzydki) podejście byłoby zastąpienie ' z \' w Widoku (nie zmienia wartości rzeczywistej - tylko koduje IT):

<input type="checkbox" ng-model="foo" 
     ng-true-value="'{{trueVal.replace('\'', '\\\'')}}'" 
     ng-false-value="null"> 

lepszym rozwiązaniem jest prawdopodobnie za pomocą ng-change:

<input type="checkbox" ng-model="t" 
     ng-change="foo = t ? trueVal : null"> 

Dłuższa wersja

Pod pokrywami ng-true-value dzwoni $parse usługa: var parseFn = $parse(expression), i oczekuje parseFn.constant === true.Ten ostatni jest tylko prawda, jeśli wyrażenie jest stała:

expression = 'string';  // string literal 
expression = '5'   // number literal 
expression = {v: 'string'} // object literal with a constant 
expression = 'foo' + 'bar'; // expression that evaluates to a constant 

W twoim przypadku trzeba wziąć zmienną trueVal, interpolować go do wartości {{trueVal}}, aby stać się częścią wyrażenia '{{trueVal}}' że ostatecznie będzie oceniana jako wyjaśniono powyżej.

Dlatego zastępowanie ' prac do \', bo ucieka singli cytaty jakby masz napisane wyrażenie bezpośrednio:

ng-true-value="'Customer didn\'t understand'" 

Jeżeli jesteś pewien, że nie będzie mieć cudzysłowów (") w swoich wartościach options, można też po prostu odwrócić kolejność cytatów bez konieczności zrobić replace:

ng-true-value='"{{trueVal}}"` 

Będzie to oczywiście , z tego samego powodu, dla którego wartość trueVal ma podwójne wartości: something with "quotes".

Answer 2

Spróbuj tego.

W Markup

<input type="checkbox" ng-model="dummyModel" ng-model-options="{getterSetter: true}"> 

kontroler

var trueValue = "my true' value"; 
var falseValue = false; 
var _model; 
$scope.dummyModel = function (val) { 
    if (angular.isDefined(val)) { 
     _model = val ? trueValue : falseValue 
    } 
    return _model === trueValue; 
} 

Korzystanie _model do przekazywania danych.