Ok, I don't know a ton about Angular or where the item (5b4ad9cb601c45e8978901b08dc087b8) comes from, but maybe we can simplify this workflow as a proof of concept. Can you try running this sample with your portalURL and webmap id, just to see if it works? This is what I understand of your workflow. Also, which version of Portal for ArcGIS are you running? This works for me with 10.6.1.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>BasemapGallery + Webmap</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.9/esri/css/main.css">
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<script src="https://js.arcgis.com/4.9/"></script>
<script>
require([
"esri/Map",
"esri/views/SceneView",
"esri/widgets/BasemapGallery",
"esri/config",
"esri/WebMap"
], function(
Map, SceneView, BasemapGallery, esriConfig, WebMap
) {
var portalUrl = "";
// Set the hostname to the on-premise portal and trust it
esriConfig.portalUrl = portalUrl;
esriConfig.request.trustedServers.push(portalUrl);
var webmap = new WebMap({
portalItem: { // autocasts as new PortalItem()
id: ""
}
});
var map = new Map({
basemap: "gray"
});
var view = new SceneView({
container: "viewDiv",
map: webmap,
center: [139.68, 35.68],
zoom: 3
});
var basemapGallery = new BasemapGallery({
view: view
});
// Add the widget to the top-right corner of the view
view.ui.add(basemapGallery, {
position: "top-right"
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>
<!DOCTYPE HTML><html><head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>BasemapGallery + Webmap</title> <link rel="stylesheet" href="https://js.arcgis.com/4.9/esri/css/main.css"> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <script src="https://js.arcgis.com/4.9/"></script> <script> require([ "esri/Map", "esri/views/SceneView", "esri/widgets/BasemapGallery", "esri/config", "esri/WebMap" ], function( Map, SceneView, BasemapGallery, esriConfig, WebMap ) { var portalUrl = ""; // Set the hostname to the on-premise portal and trust it esriConfig.portalUrl = portalUrl; esriConfig.request.trustedServers.push(portalUrl); var webmap = new WebMap({ portalItem: { // autocasts as new PortalItem() id: "" } }); var map = new Map({ basemap: "gray" }); var view = new SceneView({ container: "viewDiv", map: webmap, center: [139.68, 35.68], zoom: 3 }); var basemapGallery = new BasemapGallery({ view: view }); // Add the widget to the top-right corner of the view view.ui.add(basemapGallery, { position: "top-right" }); }); </script></head><body> <div id="viewDiv"></div></body></html>
