AngularJS no funciona en Xamarin Android Webview

Estoy tratando de cargar el contenido de la página a la webview, la referencia de contenido de página AngularJS, y el material angular. Cuando lo ejecuto en depuración en mi equipo, funciona bien a través de un emulador de Android. Pero cuando lo instalo en mi teléfono inteligente, no funciona. Parece que no sabe las bibliotecas de JavaScript. Muchas gracias por su ayuda.

MainActivity.cs:

protected override void OnCreate(Bundle bundle) { base.OnCreate(bundle); // Set our view from the "main" layout resource SetContentView(Resource.Layout.Main); var webView = FindViewById<WebView>(Resource.Id.webView); webView.Settings.JavaScriptEnabled = true; //webView.Settings.CacheMode = CacheModes.Normal; webView.Settings.DomStorageEnabled = true; webView.Settings.SetSupportMultipleWindows(true); webView.Settings.JavaScriptCanOpenWindowsAutomatically = true; webView.Settings.AllowContentAccess = true; webView.Settings.AllowFileAccess = true; webView.Settings.AllowFileAccessFromFileURLs = true; // webView.SetWebChromeClient(new WebChromeClient()); webView.SetWebViewClient(new WebViewClient()); webView.LoadUrl("file:///android_asset/Content/List.html"); }

List.html:

 <html> <head> <title>Angular JS Directive</title> <link href="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.css" rel="stylesheet"></link> <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet"></link> <style type="text/css"> .listdemoListControls md-divider { margin-top: 10px; margin-bottom: 10px; } .listdemoListControls md-list-item > p, .listdemoListControls md-list-item > .md-list-item-inner > p, .listdemoListControls md-list-item .md-list-item-inner > p, .listdemoListControls md-list-item .md-list-item-inner > .md-list-item-inner > p { -webkit-user-select: none; /* Chrome all / Safari all */ -moz-user-select: none; /* Firefox all */ -ms-user-select: none; /* IE 10+ */ user-select: none; /* Likely future */ } </style> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.9.4/angular-material.min.js"></script> <script> angular.module('MyForm', ['ngMaterial']) .config(function($mdIconProvider) { $mdIconProvider .iconSet('social', 'img/icons/sets/social-icons.svg', 24) .iconSet('device', 'img/icons/sets/device-icons.svg', 24) .iconSet('communication', 'img/icons/sets/communication-icons.svg', 24) .defaultIconSet('img/icons/sets/core-icons.svg', 24); }) .controller('ListCtrl', function($scope, $mdDialog) { $scope.liststudent= [ { name: 'Kevin', isgirl: false }, { name: 'Sara', isgirl: true}, { name: 'Bob', isgirl: false }, { name: 'Laura', isgirl: true }, { name: 'Peter', isgirl: false } ]; }); </script> </head> <body ng-app="MyForm"> <md-list ng-cloak="" ng-controller="ListCtrl"> <md-subheader class="md-no-sticky">Student list</md-subheader> <md-list-item ng-repeat="topping in liststudent"> {{ topping.name }} <br /> <md-checkbox class="md-secondary" ng-model="topping.isgirl"></md-checkbox> </md-list-item> <md-divider></md-divider> <md-list> </md-list> </md-list> </body> </html>

Captura de pantalla en el móvil:

Introduzca aquí la descripción de la imagen Captura de pantalla en el equipo: