asp.net mvc i angularJS - ukrywanie formularza

Witam Wszystkich,

Tworzę z asp.net mvc małą aplikację. Wstawiłem na stronie edycji profilu buttony odkrywające formularze zmiany hasła oraz formularze danych osobowych użytkownika.

Ogólnie wygląda to tak:

skrypt angular

var app = angular.module('MyModule', []);

app.controller('MyController', ['$scope', function ($scope) {

    $scope.display = false;

    $scope.ShowForm = function () {
        $scope.display = true;
    };

}]);

I w widoku

<div ng-app="MyModule">

    <hr />
    <div ng-controller="MyController">

        <button type="button" class="btn btn-primary" ng-click="ShowForm()">Formularz zmiany hasła</button>
        <div ng-show="display">

        t      u jest odkrywany formularz

        </div>
    </div>
</div>

Na końcu widoku w @section Scripts{} wczytuję swoje skrypty.

Ogólnie działa wszystko, tylko że przy ładowaniu strony chwilowo pojawia się formularz (do czasu wczytania skryptów angular) po czym znika. Takie trochę nieestetyczne zachowanie.

Ktoś może zna metodę jak sobie z tym poradzić ? Chciałbym wyeliminować chwilowe pojawianie się formularza przy ładowaniu strony do czasu wczytania i zadziałania skryptów angular.

Dodaj jakies id do swojego formularza i ukryj go przez css. Wtedy jak bedziesz wczytywal strone to formularz nie pojawi sie

Angular i id do ukrywania, gsus. Zrob to w angularze

Własnie nie bardzo mam koncepcję jak w angularze go zrobić. Nie chcę czystego formularza z angulara, ze względu na ValidateAntiForgeryToken potrzebuję formularz wygenerowany przez asp.net.
Pewnym rozwiązaniem byłoby zwrócenie z http.get() widoku częściowego, niestety tu angular blokuje inputy i buttony.

Poradziłem sobie z problemem wstawiając zamiast rozwiązania polegającego na ukrywaniu formularza przez skrypt angulara rozwiązanie polegające na ajaxowym pobieraniu widoku częściowego.

Użyj ng-if zamiast ng-show.

Steff napisał(a):

Użyj ng-if zamiast ng-show.

Niestety to nic nie zmienia, ten sam efekt występuje.

Witam ponownie.

W sumie problem rozwiązałem dodając do diva klasę hidden, którą na końcu skryptu angulara usuwam

$('#form1').removeClass('hidden');

A więc po załadowaniu strona nie wyświetla mi formularzy ze względu na dodanie klasy hidden, po wczytaniu skryptu klasy te są usuwane z div-ów, i niewidoczne dopóki dyrektywa angulara ng-show nie pozwoli na wyświetlenie.

Ogólnie efekt końcowy jaki oczekiwałem.