La página de vista parcial de Angular js no se carga después de hacer clic en el botón. He cargado la página de renderizado inicial, una vez que hacemos clic en el botón. La página de vista parcial se renderizará, en este momento los módulos angulares no se activan y no devuelven el texto adecuado. ¿Cómo puedo lograr este tipo de escenario?
Diseño.cshtml
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>@ViewBag.Title - Application</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.8/angular.min.js"></script> <script src="~/Scripts/app.js"></script> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> </head> <body> <div ng-app="myApp"> <div id="content"><button onclick="clicked()">Click Here</button></div> </div> @RenderBody() <script> function clicked() { $.ajax({ type: "GET", url: "/Home/About", data: null, dataType: "html", contentType: 'application/json; charset=utf-8', success: function (data) { $('#content').append(data); }, error: function (ex) { console.log(ex); } }); } </script> </body> </html>aplicación.js
var myApp = angular.module('myApp', []); myApp.controller('MyController', ['$scope', function ($scope) { // Function to be called on page load $scope.firstFunction = function ($scope) { $scope.text = "GeeksForGeeks" } }]);HomeController.cs
public PartialViewResult About() { ViewBag.Message = "Your application description page."; return PartialView(@"~/Views/Home/About.cshtml"); }Página de vista parcial: Acerca de.cshtml
<div ng-controller="MyController"> <center ng-init="firstFunction(this)"> <h1 style="color: green;">{{text}}</h1> </center> </div>Nota: al hacer clic en el botón, GeeksForGeeks debe mostrarse, aquí se agrega {{text}} en el elemento de la interfaz de usuario
intente eliminar los datos incorrectos y el tipo de contenido de usted ajax
$.ajax({ type: "GET", url: "/Home/About", success: function (data) { $('#content').append(data); //or try $('#content').html(data); }, error: function (ex) { console.log(ex); } });