Pozycja ustalona elementu AngularJS na podstawie innego elementu

Question

Ta aplikacja pobiera obraz, który jest niezbędny dla tła lub obszaru roboczego. Muszę dodać pola tekstowe wejściowe do tego obszaru roboczego z określonymi współrzędnymi (góra, lewo, szerokość, wysokość). Współrzędne te będą zależne od obrazu (góra/lewo = 0/0). Jak ustawić swoje pola/elementy względem obrazu?

 <img id="background" ng-src="{{page.backgroundImage}}" /> 
     <input type="text" ng-repeat="field in page.fields" ng-model="field.value" 
       ng-style="{position:'absolute', 
           left:field.left, 
           top:field.top, 
          width:field.width, 
          height:field.height}"/> 

Powyższy kod działa doskonale do pozycjonowania absolutnego, ale nie jest względny w stosunku do obrazu.

Answer 1

<div style="position:relative"> 
    <img id="background" ng-src="{{page.backgroundImage}}" class="course-image" /> 
    <input type="text" ng-repeat="field in page.fields" ng-model="field.value" 
      style="position:absolute" 
      ng-style="{left:field.left, 
         top:field.top, 
        width:field.width, 
        height:field.height}" />  
</div>