Обновления Ternary условия переменного угловой

Я довольно новый для углового и Im интересно, как добиться следующим:Обновления Ternary условия переменного угловой

Im использование троичного условия в моем переменных для переключения между двумя языками, не обновляя свои страницы и отображение элементов (ng-repeat) с правильными названиями.

{{isEnglish ? item.name_en : item.name_fr}}

У меня есть тумблер переключения isEnglish в true или false, но переменные не обновляются сами при переключении логического значения. Нужно ли применять изменения? есть ли способ сделать это?

язык тумблер

<a href="" class="fb border_link" ng-click="changelanguage();"> 
    {{displayLanguage}} 
</a>

нг-клик функции

$scope.changelanguage = function(){ 
    console.log("changing language"); 
    console.log($scope.$parent.isEnglish); 
    if($scope.selectedLanguage === 'en'){ 
     $translate.use('fr'); 
     $scope.$parent.isEnglish = false; 
     console.log($scope.$parent.isEnglish); 
     $scope.selectedLanguage = 'fr'; 
     $scope.displayLanguage = 'English'; 
     console.log("en"); 
    } 
    else{ 
     $translate.use('en'); 
     $scope.$parent.isEnglish = true; 
     console.log($scope.$parent.isEnglish); 
     $scope.selectedLanguage = 'en'; 
     $scope.displayLanguage = 'Français'; 
     console.log("fr"); 
    } 
    }

источник

2016-07-11 SKYnine

Вы можете написать больше кода .. – developer033

сделано, если эта помощь. тройное условие находится внутри ng-repeat div – SKYnine

@SKYnine: см. мое второе обновление. –

Попробуйте сделать isEnglish свойство объекта, например settings.isEnglish. У углового есть некоторые проблемы с необработанными переменными, привязанными к сфере видимости.

источник

2016-07-11 03:41:06 GMaiolo

не работает :( – SKYnine

@ SKYnine, в первую очередь, я настоятельно рекомендую не использовать $ parent и просто использовать службу для использования одних и тех же данных в двух разных областях. Кроме того, isEnglish тоже не должен быть переменной, это должна быть функция (или вы могли бы даже попытайтесь выполнить проверку прямо в представлении, если хотите), возвращая $ scope.selectedLanguage === 'en'. Также необработанная переменная, такая как selectedLanguage и displayLanguage (возможно, для использования двух разных переменных), может быть в объекте, как и я сказал в своем ответе, чтобы избежать каких-либо проблем. Попробуйте и застрелите меня. – GMaiolo

Я сделал объект из своих настроек, и он начал работать. Я не мог использовать причину службы. Мне нужна переменная области видимости, чтобы быть динамичной и не только при первой загрузке. В любом случае, дон Не понимаю, почему он начал работать (потому что вчера я попробовал форму объекта) – SKYnine

Update 2: Так как вы присваиваете isEnglish к $scope.$parent вы могли бы иметь $scope проблему о связанных.

Чтобы помочь устранить неполадки, я бы использовал что-то вроде Batarang, чтобы выяснить, что значение $scope.isEnglish предназначено для разных $scope. В качестве альтернативы вы можете установить привязку {{ isEnglish }} рядом с вашим тройным, чтобы подтвердить, что isEnglish устанавливается при вызове changelanguage. Если дело не в том, что будет сведено к тому, как структурируется ваш ребенок и изолированные области.

Обновление 1: Код, который вы опубликовали в своем вопросе, отлично работает. Вот работа plunkr. Судя по вашему комментарию, может быть, у вас есть область ребенка, которую вы назначаете в своем ng-click. Выполняете ли вы назначение непосредственно в выражении ng-click или это делается с помощью метода (например, в моем plunkr)?

app.controller('MainCtrl', function($scope) { 
    $scope.isEnglish = true; 

    $scope.toggle = function _toggle() { 
    $scope.isEnglish = !$scope.isEnglish; 
    }; 

    $scope.item = { 
    name_en: 'en name', 
    name_fr: 'fr name' 
    }; 
});

HTML

<body ng-controller="MainCtrl"> 
    <div> 
    <button ng-click="toggle()"> 
     Toggle isEnglish 
    </button> 
    </div> 
    <br> 
    <br> 

    <div> 
    isEnglish: 
    </div> 
    <div> 
    <b>{{ isEnglish }}</b> 
    </div> 
    <br> 

    <div> 
    isEnglish ? item.name_en : item.name_fr: 
    </div> 
    <div> 
    <b>{{isEnglish ? item.name_en : item.name_fr}}</b> 
    </div> 
</body>

Вам может понадобиться, чтобы обернуть тумблер в $scope.apply вызова, если это что-то вроде пользовательской директивы, что происходит за пределами дайджеста цикл:

// 'scope' is argument in directive link function. 
function toggle() { 
    scope.$apply(function() { 
    scope.isEnglish = !scope.isEnglish; 
    }); 
}

источник

2016-07-11 03:32:37

$ scope.isEnglish изменен в функции ng-click, так что цикл digest уже выполняется. использование $ apply() внутри - ошибка триггеров. Все, что работает от функции, работает, как и ожидалось, даже с помощью переключателя isEnglish. это просто переменная в html, которая не обновляет себя ... – SKYnine

Всегда рекомендуется обертывать $ scope.$ применяются в $ timeout-вызове, чтобы он не вступал в конфликт с текущим потоком $ digest. – GMaiolo

добавление $ timeout действительно предотвращает $ apply для запуска ошибок. но результат тот же, он не обновляет переменные :( – SKYnine

Обновления Ternary условия переменного угловой

ответ

Смежные вопросы